Transformed successfully

Makefile

@@ -282,12 +282,11 @@ SIMULATOR=iPhone 13
 # TODO: fix IOS_STATUS_GO_TARGETS to be either amd64 or arm64 when RN is upgraded
 run-ios: export TARGET := ios
 run-ios: export IOS_STATUS_GO_TARGETS := ios/arm64;iossimulator/amd64
-run-ios: export XCBeautify=$(shell which xcbeautify) # for react-native-cli to pick this up and to auto format output
 run-ios: ##@run Build iOS app and start it in a simulator/device
 ifneq ("$(SIMULATOR)", "")
-	npx react-native run-ios --simulator="$(SIMULATOR)"
+	npx react-native run-ios --simulator="$(SIMULATOR)" | xcbeautify
 else
-	npx react-native run-ios
+	npx react-native run-ios | xcbeautify
 endif
 
 show-ios-devices: ##@other shows connected ios device and its name

scripts/build-android.sh

@@ -37,14 +37,9 @@ SECRETS_ENV_VARS=(
     'ALCHEMY_ARBITRUM_MAINNET_TOKEN'
     'ALCHEMY_OPTIMISM_GOERLI_TOKEN'
     'ALCHEMY_OPTIMISM_MAINNET_TOKEN'
-    'ALCHEMY_ETHEREUM_SEPOLIA_TOKEN'
-    'ALCHEMY_ARBITRUM_SEPOLIA_TOKEN'
-    'ALCHEMY_OPTIMISM_SEPOLIA_TOKEN'
     'INFURA_TOKEN'
     'INFURA_TOKEN_SECRET'
     'OPENSEA_API_KEY'
-    'RARIBLE_MAINNET_API_KEY'
-    'RARIBLE_TESTNET_API_KEY'
     'POKT_TOKEN'
 )
 

shadow-cljs.edn

@@ -63,15 +63,10 @@
          {status-im.config/POKT_TOKEN                     #shadow/env "POKT_TOKEN"
           status-im.config/INFURA_TOKEN                   #shadow/env "INFURA_TOKEN"
           status-im.config/OPENSEA_API_KEY                #shadow/env "OPENSEA_API_KEY"
-          status-im.config/RARIBLE_MAINNET_API_KEY        #shadow/env "RARIBLE_MAINNET_API_KEY"
-          status-im.config/RARIBLE_TESTNET_API_KEY        #shadow/env "RARIBLE_TESTNET_API_KEY"
           status-im.config/ALCHEMY_ARBITRUM_GOERLI_TOKEN  #shadow/env "ALCHEMY_ARBITRUM_GOERLI_TOKEN"
           status-im.config/ALCHEMY_OPTIMISM_GOERLI_TOKEN  #shadow/env "ALCHEMY_OPTIMISM_GOERLI_TOKEN"
           status-im.config/ALCHEMY_OPTIMISM_MAINNET_TOKEN #shadow/env "ALCHEMY_OPTIMISM_MAINNET_TOKEN"
-          status-im.config/ALCHEMY_ARBITRUM_MAINNET_TOKEN #shadow/env "ALCHEMY_ARBITRUM_MAINNET_TOKEN"
-          status-im.config/ALCHEMY_ETHEREUM_SEPOLIA_TOKEN #shadow/env "ALCHEMY_ETHEREUM_SEPOLIA_TOKEN"
-          status-im.config/ALCHEMY_ARBITRUM_SEPOLIA_TOKEN #shadow/env "ALCHEMY_ARBITRUM_SEPOLIA_TOKEN"
-          status-im.config/ALCHEMY_OPTIMISM_SEPOLIA_TOKEN #shadow/env "ALCHEMY_OPTIMISM_SEPOLIA_TOKEN"}
+          status-im.config/ALCHEMY_ARBITRUM_MAINNET_TOKEN #shadow/env "ALCHEMY_ARBITRUM_MAINNET_TOKEN"}
          :compiler-options {:output-feature-set :es5
                             ;; We disable `:fn-deprecated` warnings because we
                             ;; are managing deprecation via clj-kondo and we
@@ -95,15 +90,10 @@
     {status-im.config/POKT_TOKEN                     #shadow/env "POKT_TOKEN"
      status-im.config/INFURA_TOKEN                   #shadow/env "INFURA_TOKEN"
      status-im.config/OPENSEA_API_KEY                #shadow/env "OPENSEA_API_KEY"
-     status-im.config/RARIBLE_MAINNET_API_KEY        #shadow/env "RARIBLE_MAINNET_API_KEY"
-     status-im.config/RARIBLE_TESTNET_API_KEY        #shadow/env "RARIBLE_TESTNET_API_KEY"
      status-im.config/ALCHEMY_ARBITRUM_GOERLI_TOKEN  #shadow/env "ALCHEMY_ARBITRUM_GOERLI_TOKEN"
      status-im.config/ALCHEMY_OPTIMISM_GOERLI_TOKEN  #shadow/env "ALCHEMY_OPTIMISM_GOERLI_TOKEN"
      status-im.config/ALCHEMY_OPTIMISM_MAINNET_TOKEN #shadow/env "ALCHEMY_OPTIMISM_MAINNET_TOKEN"
-     status-im.config/ALCHEMY_ARBITRUM_MAINNET_TOKEN #shadow/env "ALCHEMY_ARBITRUM_MAINNET_TOKEN"
-     status-im.config/ALCHEMY_ETHEREUM_SEPOLIA_TOKEN #shadow/env "ALCHEMY_ETHEREUM_SEPOLIA_TOKEN"
-     status-im.config/ALCHEMY_ARBITRUM_SEPOLIA_TOKEN #shadow/env "ALCHEMY_ARBITRUM_SEPOLIA_TOKEN"
-     status-im.config/ALCHEMY_OPTIMISM_SEPOLIA_TOKEN #shadow/env "ALCHEMY_OPTIMISM_SEPOLIA_TOKEN"}
+     status-im.config/ALCHEMY_ARBITRUM_MAINNET_TOKEN #shadow/env "ALCHEMY_ARBITRUM_MAINNET_TOKEN"}
     :compiler-options {:output-feature-set :es6
                        ;;disable for android build as there
                        ;;is an intermittent warning with deftype
@@ -133,15 +123,10 @@
     status-im.config/POKT_TOKEN                     #shadow/env "POKT_TOKEN"
     status-im.config/INFURA_TOKEN                   #shadow/env "INFURA_TOKEN"
     status-im.config/OPENSEA_API_KEY                #shadow/env "OPENSEA_API_KEY"
-    status-im.config/RARIBLE_MAINNET_API_KEY        #shadow/env "RARIBLE_MAINNET_API_KEY"
-    status-im.config/RARIBLE_TESTNET_API_KEY        #shadow/env "RARIBLE_TESTNET_API_KEY"
     status-im.config/ALCHEMY_ARBITRUM_GOERLI_TOKEN  #shadow/env "ALCHEMY_ARBITRUM_GOERLI_TOKEN"
     status-im.config/ALCHEMY_OPTIMISM_GOERLI_TOKEN  #shadow/env "ALCHEMY_OPTIMISM_GOERLI_TOKEN"
     status-im.config/ALCHEMY_OPTIMISM_MAINNET_TOKEN #shadow/env "ALCHEMY_OPTIMISM_MAINNET_TOKEN"
-    status-im.config/ALCHEMY_ARBITRUM_MAINNET_TOKEN #shadow/env "ALCHEMY_ARBITRUM_MAINNET_TOKEN"
-    status-im.config/ALCHEMY_ETHEREUM_SEPOLIA_TOKEN #shadow/env "ALCHEMY_ETHEREUM_SEPOLIA_TOKEN"
-    status-im.config/ALCHEMY_ARBITRUM_SEPOLIA_TOKEN #shadow/env "ALCHEMY_ARBITRUM_SEPOLIA_TOKEN"
-    status-im.config/ALCHEMY_OPTIMISM_SEPOLIA_TOKEN #shadow/env "ALCHEMY_OPTIMISM_SEPOLIA_TOKEN"}
+    status-im.config/ALCHEMY_ARBITRUM_MAINNET_TOKEN #shadow/env "ALCHEMY_ARBITRUM_MAINNET_TOKEN"}
    :compiler-options
    {;; needed because we override require and it
     ;; messes with source-map which reports callstack

src/legacy/status_im/data_store/settings.cljs

@@ -51,9 +51,3 @@
       (visibility-status-updates/<-rpc-settings)
       (set/rename-keys {:compressedKey :compressed-key
                         :emojiHash     :emoji-hash})))
-
-(defn rpc->setting-value
-  [{:keys [name] :as setting}]
-  (condp = name
-    :currency (update setting :value keyword)
-    setting))

src/legacy/status_im/ens/core.cljs

@@ -231,7 +231,7 @@
   [db]
   (into #{}
         (remove #(= (:type %) :watch)
-                (map #(eip55/address->checksum (:address %)) (vals (get-in db [:wallet :accounts]))))))
+                (map #(eip55/address->checksum (:address %)) (get db :profile/wallet-accounts)))))
 
 ;;NOTE we want to handle only last resolve
 (def resolve-last-id (atom nil))

src/legacy/status_im/ethereum/subscriptions.cljs

@@ -79,15 +79,10 @@
     "recent-history-ready"                     (recent-history-fetching-ended cofx event)
     "fetching-history-error"                   (fetching-error cofx event)
     "non-archival-node-detected"               (non-archival-node-detected cofx event)
-    "pending-transaction-status-changed"       {:fx
-                                                [[:dispatch
-                                                  [:wallet/pending-transaction-status-changed-received
-                                                   event]]]}
     "wallet-owned-collectibles-filtering-done" {:fx [[:dispatch
                                                       [:wallet/owned-collectibles-filtering-done
                                                        event]]]}
     "wallet-get-collectibles-details-done"     {:fx [[:dispatch
                                                       [:wallet/get-collectible-details-done
                                                        event]]]}
-    "wallet-tick-reload"                       {:fx [[:dispatch [:wallet/reload]]]}
     (log/debug ::unknown-wallet-event :type type :event event)))

src/legacy/status_im/events.cljs

@@ -43,7 +43,6 @@
     [react-native.permissions :as permissions]
     [react-native.platform :as platform]
     [status-im.common.biometric.events :as biometric]
-    status-im.common.serialization
     status-im.common.standard-authentication.events
     [status-im.common.theme.core :as theme]
     [status-im.common.universal-links :as universal-links]

src/legacy/status_im/ui/screens/chat/message/legacy_view.cljs

@@ -246,7 +246,7 @@
         [rn/touchable-opacity
          {:on-press #(do
                        (rf/dispatch [:pop-to-root :shell-stack])
-                       (rf/dispatch [:communities/navigate-to-community-overview (:id community)])
+                       (rf/dispatch [:navigate-to :community-overview (:id community)])
                        (rf/dispatch [:chat/close]))}
          [rn/text
           {:style {:text-align :center

src/quo/components/community/token_gating.cljs

@@ -11,17 +11,17 @@
 (defn token-requirement-list-row
   [tokens padding?]
   [rn/view {:style (style/token-row padding?)}
-   (map-indexed (fn [token-index {:keys [img-src amount sufficient? purchasable?] :as token}]
-                  ^{:key token-index}
-                  [rn/view {:style style/token-tag-spacing}
-                   [token-tag/view
-                    {:token-symbol  (:symbol token)
-                     :token-img-src img-src
-                     :token-value   amount
-                     :size          :size-24
-                     :options       (cond
-                                      sufficient?  :hold
-                                      purchasable? :add)}]])
+   (map-indexed (fn [token-index token]
+                  (let [{:keys [amount sufficient? purchasable?]} token]
+                    ^{:key token-index}
+                    [rn/view {:style style/token-tag-spacing}
+                     [token-tag/view
+                      {:token-symbol (:symbol token)
+                       :token-value  amount
+                       :size         :size-24
+                       :options      (cond
+                                       sufficient?  :hold
+                                       purchasable? :add)}]]))
                 tokens)])
 
 (defn- internal-view

src/quo/components/drawers/drawer_top/view.cljs

@@ -76,19 +76,15 @@
    (str description " · " (i18n/label :t/on-device))])
 
 (defn- context-tag-subtitle
-  [{:keys [context-tag-type community-logo community-name account-name emoji customization-color]}]
-  (let [tag-type (or context-tag-type :account)]
-    [rn/view
-     {:accessibility-label :context-tag-wrapper
-      :style               {:flex-wrap :wrap}}
-     [context-tag/view
-      {:type                tag-type
-       :account-name        account-name
-       :emoji               emoji
-       :community-name      community-name
-       :community-logo      community-logo
-       :size                24
-       :customization-color customization-color}]]))
+  [{:keys [community-logo community-name]}]
+  [rn/view
+   {:accessibility-label :context-tag-wrapper
+    :style               {:flex-wrap :wrap}}
+   [context-tag/view
+    {:type           :community
+     :community-name community-name
+     :community-logo community-logo
+     :size           24}]])
 
 (defn- description-subtitle
   [{:keys [theme blur? description]}]
@@ -99,8 +95,7 @@
    description])
 
 (defn- subtitle
-  [{:keys [type theme blur? keycard? networks description community-name community-logo
-           context-tag-type account-name emoji customization-color]}]
+  [{:keys [type theme blur? keycard? networks description community-name community-logo]}]
   (cond
     (= :keypair type)
     [keypair-subtitle
@@ -123,12 +118,8 @@
 
     (= :context-tag type)
     [context-tag-subtitle
-     {:context-tag-type    context-tag-type
-      :community-logo      community-logo
-      :community-name      community-name
-      :account-name        account-name
-      :emoji               emoji
-      :customization-color customization-color}]
+     {:community-logo community-logo
+      :community-name community-name}]
 
     (and (not= :label type) description)
     [description-subtitle
@@ -182,7 +173,6 @@
 
 (defn- view-internal
   [{:keys [title title-icon type theme description blur? community-name community-logo button-icon
-           account-name emoji
            on-button-press
            on-button-long-press
            button-disabled? account-avatar-emoji account-avatar-type customization-color icon-avatar
@@ -206,17 +196,14 @@
       :theme      theme
       :blur?      blur?}]
     [subtitle
-     {:type                type
-      :theme               theme
-      :blur?               blur?
-      :keycard?            keycard?
-      :networks            networks
-      :description         description
-      :community-name      community-name
-      :community-logo      community-logo
-      :customization-color customization-color
-      :account-name        account-name
-      :emoji               emoji}]]
+     {:type           type
+      :theme          theme
+      :blur?          blur?
+      :keycard?       keycard?
+      :networks       networks
+      :description    description
+      :community-name community-name
+      :community-logo community-logo}]]
    [right-icon
     {:theme                theme
      :type                 type

src/quo/components/gradient/gradient_cover/style.cljs

@@ -1,6 +1,6 @@
 (ns quo.components.gradient.gradient-cover.style)
 
 (defn root-container
-  [opacity height]
-  {:height  (or height 252)
+  [opacity]
+  {:height  252
    :opacity opacity})

src/quo/components/gradient/gradient_cover/view.cljs

@@ -6,7 +6,7 @@
     [react-native.linear-gradient :as linear-gradient]))
 
 (defn- view-internal
-  [{:keys [customization-color opacity container-style height] :or {customization-color :blue}}]
+  [{:keys [customization-color opacity container-style] :or {customization-color :blue}}]
   (let [color-top    (colors/custom-color customization-color 50 20)
         color-bottom (colors/custom-color customization-color 50 0)]
     [linear-gradient/linear-gradient
@@ -14,6 +14,6 @@
       :colors              [color-top color-bottom]
       :start               {:x 0 :y 0}
       :end                 {:x 0 :y 1}
-      :style               (merge (style/root-container opacity height) container-style)}]))
+      :style               (merge (style/root-container opacity) container-style)}]))
 
 (def view (quo.theme/with-theme view-internal))

src/quo/components/list_items/network_list/component_spec.cljs

@@ -1,40 +0,0 @@
-(ns quo.components.list-items.network-list.component-spec
-  (:require [quo.components.list-items.network-list.view :as network-list]
-            [quo.foundations.colors :as colors]
-            [test-helpers.component :as h]))
-
-(defn- render
-  [component]
-  (h/render-with-theme-provider component :light))
-
-(def props
-  {:theme               :light
-   :state               :default
-   :label               "Mainnet"
-   :network-image       873
-   :customization-color :blue
-   :token-value         "100.00 ETH"
-   :fiat-value          "€100.00"})
-
-
-(h/describe "List items: Network List"
-  (h/test "default state explicit"
-    (render [network-list/view props])
-    (h/is-truthy (h/get-by-text "Mainnet")))
-
-  (h/test "Pressed state"
-    (render [network-list/view props])
-    (h/fire-event :on-press-in (h/get-by-label-text ::network-list))
-    (h/wait-for #(h/has-style (h/query-by-label-text ::network-list)
-                              {:backgroundColor (colors/resolve-color :blue :light 5)})))
-
-  (h/test "Active state"
-    (render [network-list/view (assoc props :state :active)])
-    (h/has-style (h/query-by-label-text ::network-list)
-                 {:backgroundColor (colors/resolve-color :blue :light 10)}))
-
-  (h/test "Call on-press"
-    (let [on-press (h/mock-fn)]
-      (render [network-list/view (assoc props :on-press on-press)])
-      (h/fire-event :on-press (h/get-by-label-text ::network-list))
-      (h/was-called on-press))))

src/quo/components/list_items/network_list/style.cljs

@@ -1,41 +0,0 @@
-(ns quo.components.list-items.network-list.style
-  (:require [quo.foundations.colors :as colors]))
-
-(defn- background-color
-  [state customization-color theme]
-  (case state
-    :pressed (colors/resolve-color customization-color theme 5)
-    :active  (colors/resolve-color customization-color theme 10)
-    :transparent))
-
-(defn container
-  [state customization-color theme]
-  {:flex-direction     :row
-   :justify-content    :space-between
-   :align-items        :center
-   :padding-horizontal 12
-   :padding-vertical   8
-   :border-radius      12
-   :height             56
-   :background-color   (background-color state customization-color theme)})
-
-(def info
-  {:flex-direction :row
-   :align-items    :center
-   :gap            2})
-
-(def network-image
-  {:border-width     1
-   :border-radius    16
-   :border-color     colors/neutral-80-opa-5
-   :margin-right     8
-   :background-color colors/neutral-80-opa-5
-   :height           32
-   :width            32})
-
-(def values-container
-  {:align-items :flex-end})
-
-(defn fiat-value
-  [theme]
-  {:color (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)})

src/quo/components/list_items/network_list/view.cljs

@@ -1,76 +0,0 @@
-(ns quo.components.list-items.network-list.view
-  (:require
-    [clojure.string :as string]
-    [quo.components.list-items.network-list.style :as style]
-    [quo.components.markdown.text :as text]
-    [quo.theme :as quo.theme]
-    [react-native.core :as rn]
-    [reagent.core :as reagent]
-    [schema.core :as schema]))
-
-(defn- info
-  [{:keys [network-image label]}]
-  [rn/view {:style style/info}
-   [rn/image
-    {:source network-image
-     :style  style/network-image}]
-   [rn/view
-    [text/text
-     {:weight          :semi-bold
-      :style           {:text-transform :capitalize}
-      :number-of-lines 1}
-     (if (string/blank? label) "-" label)]]])
-
-(defn- values
-  [{:keys [token-value fiat-value theme]}]
-  [rn/view {:style style/values-container}
-   [text/text
-    {:weight          :medium
-     :size            :paragraph-2
-     :number-of-lines 1}
-    token-value]
-   [text/text
-    {:style           (style/fiat-value theme)
-     :size            :paragraph-2
-     :number-of-lines 1}
-    fiat-value]])
-
-(def ?schema
-  [:=>
-   [:catn
-    [:props
-     [:map {:closed true}
-      [:network-image :int]
-      [:label :string]
-      [:fiat-value :string]
-      [:token-value :string]
-      [:customization-color {:optional true} [:maybe :schema.common/customization-color]]
-      [:state [:enum :pressed :active :default]]
-      [:on-press {:optional true} [:maybe fn?]]
-      [:theme :schema.common/theme]]]]
-   :any])
-
-(defn- view-internal
-  []
-  (let [pressed?     (reagent/atom false)
-        on-press-in  #(reset! pressed? true)
-        on-press-out #(reset! pressed? false)]
-    (fn [{:keys [on-press state customization-color theme]
-          :as   props
-          :or   {customization-color :blue}}]
-      (let [internal-state (if @pressed?
-                             :pressed
-                             state)]
-
-        [rn/pressable
-         {:style               (style/container internal-state customization-color theme)
-          :on-press-in         on-press-in
-          :on-press-out        on-press-out
-          :on-press            on-press
-          :accessibility-label :network-list}
-         [info props]
-         [values props]]))))
-
-(def view
-  (quo.theme/with-theme
-   (schema/instrument #'view-internal ?schema)))

src/quo/components/list_items/user_list.cljs

@@ -1,4 +1,4 @@
-(ns quo.components.list-items.user
+(ns quo.components.list-items.user-list
   (:require
     [quo.components.avatars.user-avatar.view :as user-avatar]
     [quo.components.icon :as icons]
@@ -18,14 +18,14 @@
    :align-items        :center})
 
 (defn action-icon
-  [{:keys [type on-press on-check disabled? checked?]} theme]
+  [{:keys [type on-press on-check disabled? checked?]}]
   [rn/touchable-opacity
    {:on-press (when on-press on-press)}
    (case type
      :options
      [icons/icon :i/options
       {:size  20
-       :color (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)}]
+       :color (colors/theme-colors colors/neutral-50 colors/neutral-40)}]
      :checkbox
      [selectors/view
       {:type                :checkbox
@@ -37,33 +37,30 @@
      [text/text "not implemented"]
      [rn/view])])
 
-(defn user
+(defn user-list
   [{:keys [short-chat-key primary-name secondary-name photo-path online? contact? verified?
-           untrustworthy? on-press on-long-press accessory customization-color theme]}]
-  [rn/touchable-highlight
+           untrustworthy? on-press on-long-press accessory]}]
+  [rn/touchable-opacity
    {:style               container-style
-    :underlay-color      (colors/resolve-color customization-color theme 5)
     :accessibility-label :user-list
     :on-press            (when on-press on-press)
     :on-long-press       (when on-long-press on-long-press)}
-   [:<>
-    [user-avatar/user-avatar
-     {:full-name       primary-name
-      :profile-picture photo-path
-      :online?         online?
-      :size            :small}]
-    [rn/view {:style {:margin-horizontal 8 :flex 1}}
-     [author/view
-      {:primary-name   primary-name
-       :secondary-name secondary-name
-       :contact?       contact?
-       :verified?      verified?
-       :untrustworthy? untrustworthy?
-       :size           15}]
-     (when short-chat-key
-       [text/text
-        {:size  :paragraph-2
-         :style {:color (colors/theme-colors colors/neutral-50 colors/neutral-40)}}
-        short-chat-key])]
-    (when accessory
-      [action-icon accessory theme])]])
+   [user-avatar/user-avatar
+    {:full-name       primary-name
+     :profile-picture photo-path
+     :online?         online?
+     :size            :small}]
+   [rn/view {:style {:margin-horizontal 8 :flex 1}}
+    [author/view
+     {:primary-name   primary-name
+      :secondary-name secondary-name
+      :contact?       contact?
+      :verified?      verified?
+      :untrustworthy? untrustworthy?}]
+    (when short-chat-key
+      [text/text
+       {:size  :paragraph-1
+        :style {:color (colors/theme-colors colors/neutral-50 colors/neutral-40)}}
+       short-chat-key])]
+   (when accessory
+     [action-icon accessory])])

src/quo/components/messages/author/style.cljs

@@ -38,7 +38,7 @@
 (defn icon-container
   [is-first?]
   {:margin-left   (if is-first? 4 2)
-   :margin-bottom 4})
+   :margin-bottom 2})
 
 (defn time-text
   [theme]

src/quo/components/messages/author/view.cljs

@@ -51,7 +51,8 @@
       [icons/icon :main-icons2/untrustworthy
        {:size            12
         :no-color        true
-        :container-style (style/icon-container contact?)}])]
+        :container-style (style/icon-container contact?)}])
+   ]
    (when (and (not verified?) short-chat-key)
      [text/text
       {:weight          :monospace

src/quo/components/selectors/react_selector/view.cljs

@@ -34,9 +34,10 @@
                                                     (= :pinned use-case)
                                                     theme)
                                     container-style)}
-       [rn/text
-        {:accessibility-label :emoji}
-        (reaction.resource/system-emojis emoji)]
+       [rn/image
+        {:style               {:width 15 :height 15}
+         :accessibility-label :emoji
+         :source              (reaction.resource/get-reaction emoji)}]
        [text/text
         {:size   :paragraph-2
          :weight :semi-bold

src/quo/components/selectors/reaction_resource.cljs

@@ -4,14 +4,6 @@
 (def ^:private reactions
   (resolve-all-reactions))
 
-(def system-emojis
-  {:reaction/thumbs-up   "👍"
-   :reaction/thumbs-down "👎"
-   :reaction/love        "❤"
-   :reaction/laugh       "😂"
-   :reaction/sad         "😢"
-   :reaction/angry       "😡"})
-
 (defn get-reaction
   [reaction]
   (assert (keyword? reaction) "Reaction should be a keyword")

src/quo/components/selectors/reactions_selector/view.cljs

@@ -19,5 +19,6 @@
                                (swap! pressed? not)
                                (when on-press
                                  (on-press e)))}
-       [rn/text
-        (reactions.resource/system-emojis emoji)]])))
+       [rn/image
+        {:source (reactions.resource/get-reaction emoji)
+         :style  {:width 20 :height 20}}]])))

src/quo/components/settings/category/settings/view.cljs

@@ -8,20 +8,19 @@
 
 (defn- category-internal
   [{:keys [label data container-style] :as props}]
-  (let [settings-item (filter identity data)]
-    [rn/view {:style (merge (style/container label) container-style)}
-     (when label
-       [text/text
-        {:weight :medium
-         :size   :paragraph-2
-         :style  (style/label props)}
-        label])
-     [rn/view {:style (style/settings-items props)}
-      (for [item settings-item]
-        ^{:key item}
-        [:<>
-         [settings-item/view item]
-         (when-not (= item (last settings-item))
-           [rn/view {:style (style/settings-separator props)}])])]]))
+  [rn/view {:style (merge (style/container label) container-style)}
+   (when label
+     [text/text
+      {:weight :medium
+       :size   :paragraph-2
+       :style  (style/label props)}
+      label])
+   [rn/view {:style (style/settings-items props)}
+    (for [item data]
+      ^{:key item}
+      [:<>
+       [settings-item/view item]
+       (when-not (= item (last data))
+         [rn/view {:style (style/settings-separator props)}])])]])
 
 (def settings-category (quo.theme/with-theme category-internal))

src/quo/components/settings/data_item/view.cljs

@@ -20,7 +20,7 @@
            network-image]
     :or   {subtitle-type :default}}]
   [rn/view {:style style/subtitle-container}
-   (when (and subtitle-type (not= :small size))
+   (when (not= :small size)
      [rn/view {:style (style/subtitle-icon-container subtitle-type)}
       (case subtitle-type
         :icon    [icons/icon icon

src/quo/components/share/share_qr_code/style.cljs

@@ -16,12 +16,6 @@
    :padding-top        12
    :padding-bottom     8})
 
-(def gradient-bg
-  {:position :absolute
-   :top      0
-   :left     0
-   :right    0})
-
 ;;; Header
 (def header-container
   {:flex-direction :row

src/quo/components/share/share_qr_code/view.cljs

@@ -4,13 +4,14 @@
             [oops.core :as oops]
             [quo.components.avatars.account-avatar.view :as account-avatar]
             [quo.components.buttons.button.view :as button]
-            [quo.components.gradient.gradient-cover.view :as gradient-cover]
             [quo.components.markdown.text :as text]
             [quo.components.share.qr-code.view :as qr-code]
             [quo.components.share.share-qr-code.style :as style]
             [quo.components.tabs.tab.view :as tab]
             [quo.theme]
+            [react-native.blur :as blur]
             [react-native.core :as rn]
+            [react-native.platform :as platform]
             [reagent.core :as reagent]
             [utils.i18n :as i18n]))
 
@@ -125,44 +126,41 @@
   [{:keys [share-qr-type qr-image-uri component-width customization-color full-name
            profile-picture emoji on-share-press]
     :as   props}]
-  [:<>
-   [rn/view {:style style/gradient-bg}
-    [gradient-cover/view {:customization-color customization-color :height 463}]]
-   [rn/view {:style style/content-container}
+  [rn/view {:style style/content-container}
+   [rn/view
+    {:style style/share-qr-container}
     [rn/view
-     {:style style/share-qr-container}
-     [rn/view
-      {:style style/share-qr-inner-container}
-      [account-avatar/view
-       {:customization-color customization-color
-        :emoji               emoji
-        :size                32}]
-      [text/text
-       {:size   :heading-2
-        :weight :semi-bold
-        :style  {:margin-left 8}} full-name]]
-     [share-button {:on-press on-share-press}]]
-    (when (#{:wallet-legacy :wallet-multichain} share-qr-type)
-      [header props])
-    [quo.theme/provider {:theme :light}
-     [qr-code/view
-      {:qr-image-uri        qr-image-uri
-       :size                (style/qr-code-size component-width)
-       :avatar              (if (= share-qr-type :profile)
-                              :profile
-                              :wallet-account)
-       :customization-color customization-color
-       :full-name           full-name
-       :profile-picture     profile-picture
-       :emoji               emoji}]]
-    [rn/view {:style style/bottom-container}
-     (case share-qr-type
-       :profile           [profile-bottom props]
-       :wallet-legacy     [wallet-legacy-bottom props]
-       :wallet-multichain [wallet-multichain-bottom props]
-       nil)]]])
+     {:style style/share-qr-inner-container}
+     [account-avatar/view
+      {:customization-color customization-color
+       :emoji               emoji
+       :size                32}]
+     [text/text
+      {:size   :heading-2
+       :weight :semi-bold
+       :style  {:margin-left 8}} full-name]]
+    [share-button {:on-press on-share-press}]]
+   (when (#{:wallet-legacy :wallet-multichain} share-qr-type)
+     [header props])
+   [quo.theme/provider {:theme :light}
+    [qr-code/view
+     {:qr-image-uri        qr-image-uri
+      :size                (style/qr-code-size component-width)
+      :avatar              (if (= share-qr-type :profile)
+                             :profile
+                             :wallet-account)
+      :customization-color customization-color
+      :full-name           full-name
+      :profile-picture     profile-picture
+      :emoji               emoji}]]
+   [rn/view {:style style/bottom-container}
+    (case share-qr-type
+      :profile           [profile-bottom props]
+      :wallet-legacy     [wallet-legacy-bottom props]
+      :wallet-multichain [wallet-multichain-bottom props]
+      nil)]])
 
-(defn- view-internal
+(defn view
   "Receives the following properties:
    - type:                :profile | :wallet-legacy | :wallet-multichain
    - qr-image-uri:        Image source value.
@@ -192,9 +190,16 @@
      Sometimes while using a blur layer on top of another on Android, this component looks
      bad because of the `blur/view`, so we can set `unblur-on-android? true` to fix it.
      "
-  [props]
+  [{:keys [unblur-on-android?] :as props}]
   (reagent/with-let [component-width     (reagent/atom nil)
-                     container-component [rn/view {:background-color style/overlay-color}]]
+                     container-component (if (and platform/android? unblur-on-android?)
+                                           [rn/view {:background-color style/overlay-color}]
+                                           [blur/view
+                                            {:blur-radius      20
+                                             :blur-amount      20
+                                             :blur-type        :transparent
+                                             :overlay-color    style/overlay-color
+                                             :background-color style/overlay-color}])]
     [quo.theme/provider {:theme :dark}
      [rn/view
       {:accessibility-label :share-qr-code
@@ -206,6 +211,3 @@
                (-> props
                    (assoc :component-width @component-width)
                    (clojure.set/rename-keys {:type :share-qr-type}))]))]]))
-
-
-(def view (quo.theme/with-theme view-internal))

src/quo/components/tags/token_tag/view.cljs

@@ -20,7 +20,7 @@
     - :token-symbol - string"
   []
   (let [container-width (reagent/atom 0)]
-    (fn [{:keys [options size blur? theme token-value token-img-src token-symbol]
+    (fn [{:keys [options size blur? theme token-value token-symbol]
           :or   {size :size-24}}]
       [rn/view
        {:on-layout #(reset! container-width
@@ -42,12 +42,11 @@
                   [])}
         [rn/view {:style (style/container size options blur? theme)}
          [token/view
-          {:style        (style/token-img size)
-           :token        token-symbol
-           :size         (case size
-                           :size-24 :size-20
-                           :size-32 :size-28)
-           :image-source token-img-src}]
+          {:style (style/token-img size)
+           :token token-symbol
+           :size  (case size
+                    :size-24 :size-20
+                    :size-32 :size-28)}]
          [text/text
           {:size   :paragraph-2
            :weight :medium

src/quo/components/utilities/token/view.cljs

@@ -15,7 +15,9 @@
      [:token {:optional true} [:or keyword? string?]]
      [:style {:optional true} map?]
      ;; Ignores `token` and uses this as parameter to `rn/image`'s source.
-     [:image-source {:optional true} [:or :schema.common/image-source :string]]]]
+     [:image-source {:optional true} [:or :schema.common/image-source :string]]
+     ;; If true, adds `data:image/png;base64,` as prefix to the string passed as `image-source`
+     [:add-b64-prefix? {:optional true} boolean?]]]
    :any])
 
 (defn- size->number
@@ -50,32 +52,28 @@
             first
             string/capitalize)]])
 
-(defn- normalize-b64-string
-  [b64-image]
-  (if (string/starts-with? b64-image "data:image/")
-    b64-image
-    (str b64-png-image-prefix b64-image)))
-
 (defn view-internal
   "Render a token image.
    Props:
-   - style:        extra styles to apply to the `rn/image` component.
-   - size:         `:size-nn` or just `nn`, being `nn` any number. Defaults to 32.
-   - token:        string or keyword, it can contain upper case letters or not.
-                   E.g. all of these are valid and resolve to the same:
-                   :token/snt | :snt | :SNT | \"SNT\" | \"snt\".
-   - image-source: Ignores `token` and uses this as parameter to `rn/image`'s source, it
-                   can be a b64 string representing an image.
+   - style:           extra styles to apply to the `rn/image` component.
+   - size:            `:size-nn` or just `nn`, being `nn` any number. Defaults to 32.
+   - token:           string or keyword, it can contain upper case letters or not.
+                      E.g. all of these are valid and resolve to the same:
+                      :token/snt | :snt | :SNT | \"SNT\" | \"snt\".
+   - image-source:    Ignores `token` and uses this as parameter to `rn/image`'s source.
+   - add-b64-prefix?: If true, adds `data:image/png;base64,` as prefix to the string
+                      passed as `image-source`.
   "
-  [{:keys [token size style image-source]
+  [{:keys [token size style image-source add-b64-prefix?]
     :or   {size 32}}]
-  (let [img-src (if (string? image-source)
-                  (normalize-b64-string image-source)
-                  image-source)]
-    (if-let [existing-source (or img-src (token-loader/get-token-image token))]
+  (let [b64-string (if (and image-source add-b64-prefix?)
+                     (str b64-png-image-prefix image-source)
+                     image-source)
+        source     (or b64-string (token-loader/get-token-image token))]
+    (if source
       [rn/image
        {:style  (token-style style size)
-        :source existing-source}]
+        :source source}]
       [temp-empty-symbol token size style])))
 
 (def view (schema/instrument #'view-internal ?schema))

src/quo/components/wallet/token_input/style.cljs

@@ -1,7 +1,8 @@
 (ns quo.components.wallet.token-input.style
   (:require
     [quo.foundations.colors :as colors]
-    [quo.foundations.typography :as typography]))
+    [quo.foundations.typography :as typography]
+    [react-native.platform :as platform]))
 
 (defn main-container
   [width]
@@ -23,7 +24,7 @@
 
 (def token-label-container
   {:position       :absolute
-   :left           40 ; token image size + margin
+   :left           32
    :right          0
    :bottom         0
    :top            0
@@ -34,27 +35,20 @@
   {:position :absolute
    :top      0
    :bottom   0
-   :left     40 ; token image size + margin
+   :left     32 ; token image size
    :right    0})
 
 (def text-input-dimensions
-  (-> typography/heading-1
-      (dissoc :letter-spacing)
-      (assoc :font-weight    "600"
-             :margin-right   5
-             :padding-left   0
-             :padding-right  0
-             :padding-top    0
-             :padding-bottom 0
-             :height         "100%")))
+  (assoc typography/heading-1
+         :font-weight  "600"
+         :margin-left  8
+         :margin-right (if platform/ios? 6 4)
+         :padding      0
+         :height       "100%"))
 
 (defn text-input
-  [theme error?]
-  (assoc text-input-dimensions
-         :color
-         (if error?
-           (colors/resolve-color :danger theme)
-           (colors/theme-colors colors/neutral-100 colors/white theme))))
+  [theme]
+  (assoc text-input-dimensions :color (colors/theme-colors colors/neutral-100 colors/white theme)))
 
 (defn placeholder-text
   [theme]

src/quo/components/wallet/token_input/view.cljs

@@ -12,42 +12,26 @@
     [react-native.core :as rn]
     [reagent.core :as reagent]))
 
-(defn fiat-format
-  [currency num-value conversion]
-  (str (get common/currency-label currency) (.toFixed (* num-value conversion) 2)))
-
-(defn crypto-format
-  [num-value conversion crypto-decimals token]
-  (str (.toFixed (/ num-value conversion) (or crypto-decimals 2))
-       " "
-       (string/upper-case (or (clj->js token) ""))))
-
 (defn calc-value
-  [{:keys [crypto? currency token value conversion crypto-decimals]}]
+  [crypto? currency token value conversion]
   (let [num-value (if (string? value)
                     (or (parse-double value) 0)
                     value)]
     (if crypto?
-      (fiat-format currency num-value conversion)
-      (crypto-format num-value conversion crypto-decimals token))))
+      (str (get common/currency-label currency) (.toFixed (* num-value conversion) 2))
+      (str (.toFixed (/ num-value conversion) 2)
+           " "
+           (string/upper-case (or (clj->js token) ""))))))
 
 (defn- data-info
-  [{:keys [theme token crypto-decimals conversion networks title crypto? currency amount error?]}]
+  [{:keys [theme conversion networks title crypto? currency token amount]}]
   [rn/view {:style style/data-container}
-   [network-tag/view
-    {:networks networks
-     :title    title
-     :status   (when error? :error)}]
+   [network-tag/view {:networks networks :title title}]
    [text/text
     {:size   :paragraph-2
      :weight :medium
      :style  (style/fiat-amount theme)}
-    (calc-value {:crypto?         crypto?
-                 :currency        currency
-                 :token           token
-                 :value           amount
-                 :conversion      conversion
-                 :crypto-decimals crypto-decimals})]])
+    (calc-value crypto? currency token amount conversion)]])
 
 (defn- token-name-text
   [theme text]
@@ -63,12 +47,12 @@
    {:style          style/token-label-container
     :pointer-events :none}
    [rn/text-input
-    {:max-length  12
-     :style       style/text-input-dimensions
-     :editable    false
-     :placeholder "0"
-     :opacity     0
-     :value       value}]
+    {:auto-focus true
+     :max-length 12
+     :style      style/text-input-dimensions
+     :editable   false
+     :opacity    0
+     :value      value}]
    [token-name-text theme text]])
 
 (defn input-section
@@ -83,7 +67,7 @@
                                   (reset! value-atom v))
                                 (when on-change-text
                                   (on-change-text v)))]
-    (fn [{:keys [theme token customization-color show-keyboard? crypto? currency value error?]
+    (fn [{:keys [theme token customization-color show-keyboard? crypto? currency value]
           :or   {show-keyboard? true}}]
       [rn/pressable
        {:on-press focus-input
@@ -93,7 +77,7 @@
          :size  :size-32}]
        [rn/view {:style style/text-input-container}
         [rn/text-input
-         (cond-> {:style                    (style/text-input theme error?)
+         (cond-> {:style                    (style/text-input theme)
                   :placeholder-text-color   (style/placeholder-text theme)
                   :auto-focus               true
                   :ref                      set-ref

src/quo/core.cljs

@@ -80,14 +80,13 @@
     quo.components.list-items.community.view
     quo.components.list-items.dapp.view
     quo.components.list-items.menu-item
-    quo.components.list-items.network-list.view
     quo.components.list-items.preview-list.view
     quo.components.list-items.quiz-item.view
     quo.components.list-items.saved-address.view
     quo.components.list-items.saved-contact-address.view
     quo.components.list-items.token-network.view
     quo.components.list-items.token-value.view
-    quo.components.list-items.user
+    quo.components.list-items.user-list
     quo.components.loaders.skeleton-list.view
     quo.components.markdown.list.view
     quo.components.markdown.text
@@ -300,17 +299,16 @@
 (def account-list-card quo.components.list-items.account-list-card.view/view)
 (def address quo.components.list-items.address.view/view)
 (def channel quo.components.list-items.channel.view/view)
-(def community-list quo.components.list-items.community.view/view)
+(def community-list-item quo.components.list-items.community.view/view)
 (def dapp quo.components.list-items.dapp.view/view)
 (def menu-item quo.components.list-items.menu-item/menu-item)
-(def network-list quo.components.list-items.network-list.view/view)
 (def preview-list quo.components.list-items.preview-list.view/view)
 (def quiz-item quo.components.list-items.quiz-item.view/view)
 (def saved-address quo.components.list-items.saved-address.view/view)
 (def saved-contact-address quo.components.list-items.saved-contact-address.view/view)
 (def token-network quo.components.list-items.token-network.view/view)
 (def token-value quo.components.list-items.token-value.view/view)
-(def user quo.components.list-items.user/user)
+(def user-list quo.components.list-items.user-list/user-list)
 
 ;;;; Loaders
 (def skeleton-list quo.components.loaders.skeleton-list.view/view)

src/quo/core_spec.cljs

@@ -48,7 +48,6 @@
     quo.components.list-items.channel.component-spec
     quo.components.list-items.community.component-spec
     quo.components.list-items.dapp.component-spec
-    quo.components.list-items.network-list.component-spec
     quo.components.list-items.quiz-item.component-spec
     quo.components.list-items.saved-address.component-spec
     quo.components.list-items.saved-contact-address.component-spec

src/react_native/section_list.cljs

@@ -17,19 +17,19 @@
   (fn [^js data]
     (let [^js section (.-section data)]
       (reagent/as-element [f
-                           {:index (.-index section)
-                            :title (.-title section)
+                           {:title (.-title section)
                             :data  (.-data section)}]))))
 
 (defn- wrap-per-section-render-fn
-  [index props]
-  (-> (if-let [f (:render-fn props)]
-        (assoc (dissoc props :render-fn :render-data)
-               :renderItem
-               (memo-wrap-render-fn f (:render-data props)))
-        props)
-      (update :data to-array)
-      (assoc :index index)))
+  [props]
+  (update
+   (if-let [f (:render-fn props)]
+     (assoc (dissoc props :render-fn :render-data)
+            :renderItem
+            (memo-wrap-render-fn f (:render-data props)))
+     props)
+   :data
+   to-array))
 
 (defn section-list
   "A wrapper for SectionList.
@@ -42,8 +42,6 @@
           props
           (when render-section-footer-fn
             {:renderSectionFooter (wrap-render-section-header-fn render-section-footer-fn)})
-          {:sections            (->> sections
-                                     (map-indexed wrap-per-section-render-fn)
-                                     (clj->js))
+          {:sections            (clj->js (map wrap-per-section-render-fn sections))
            :renderSectionHeader (wrap-render-section-header-fn render-section-header-fn)
            :style               style})])

src/status_im/common/contact_list/style.cljs

@@ -1,5 +0,0 @@
-(ns status-im.common.contact-list.style)
-
-(defn contacts-section-header
-  [first-item?]
-  {:padding-top (if first-item? 0 8)})

src/status_im/common/contact_list/view.cljs

@@ -1,10 +1,7 @@
 (ns status-im.common.contact-list.view
   (:require
-    [quo.core :as quo]
-    [react-native.core :as rn]
-    [status-im.common.contact-list.style :as style]))
+    [quo.core :as quo]))
 
 (defn contacts-section-header
-  [{:keys [title index]}]
-  [rn/view (style/contacts-section-header (= index 0))
-   [quo/divider-label title]])
+  [{:keys [title]}]
+  [quo/divider-label title])

src/status_im/common/contact_list_item/view.cljs

@@ -6,21 +6,17 @@
 
 (defn contact-list-item
   [{:keys [on-press on-long-press accessory]}
-   {:keys [primary-name secondary-name public-key compressed-key ens-verified added?]}
-   theme]
-  (let [photo-path          (rf/sub [:chats/photo-path public-key])
-        online?             (rf/sub [:visibility-status-updates/online? public-key])
-        customization-color (rf/sub [:profile/customization-color])]
-    [quo/user
-     {:customization-color customization-color
-      :theme               theme
-      :short-chat-key      (address/get-shortened-compressed-key (or compressed-key public-key))
-      :primary-name        primary-name
-      :secondary-name      secondary-name
-      :photo-path          photo-path
-      :online?             online?
-      :verified?           ens-verified
-      :contact?            added?
-      :on-press            on-press
-      :on-long-press       on-long-press
-      :accessory           accessory}]))
+   {:keys [primary-name secondary-name public-key compressed-key ens-verified added?]}]
+  (let [photo-path (rf/sub [:chats/photo-path public-key])
+        online?    (rf/sub [:visibility-status-updates/online? public-key])]
+    [quo/user-list
+     {:short-chat-key (address/get-shortened-compressed-key (or compressed-key public-key))
+      :primary-name   primary-name
+      :secondary-name secondary-name
+      :photo-path     photo-path
+      :online?        online?
+      :verified?      ens-verified
+      :contact?       added?
+      :on-press       on-press
+      :on-long-press  on-long-press
+      :accessory      accessory}]))

src/status_im/common/floating_button_page/view.cljs

@@ -52,8 +52,7 @@
      :remove-listeners    remove-listeners}))
 
 (defn view
-  [{:keys [header footer customization-color footer-container-padding gradient-cover?]
-    :or   {footer-container-padding (safe-area/get-top)}} &
+  [{:keys [header footer customization-color gradient-cover?]} &
    children]
   (reagent/with-let [window-height                (:height (rn/get-window))
                      footer-container-height      (reagent/atom 0)
@@ -95,7 +94,7 @@
                children)]
         [rn/keyboard-avoiding-view
          {:style                    style/keyboard-avoiding-view
-          :keyboard-vertical-offset (if platform/ios? footer-container-padding 0)
+          :keyboard-vertical-offset (if platform/ios? (safe-area/get-top) 0)
           :pointer-events           :box-none}
          [floating-container/view
           {:on-layout       set-footer-container-height

src/status_im/common/lightbox/events.cljs

@@ -1,37 +0,0 @@
-(ns status-im.common.lightbox.events
-  (:require [reagent.core :as reagent]
-            status-im.common.lightbox.effects
-            [utils.re-frame :as rf]))
-
-(rf/reg-event-fx :lightbox/navigate-to-lightbox
- (fn [{:keys [db]} [animation-shared-element-id screen-params]]
-   (reagent/next-tick #(rf/dispatch [:navigate-to :lightbox screen-params]))
-   {:db (assoc db :animation-shared-element-id animation-shared-element-id)}))
-
-(rf/reg-event-fx :lightbox/update-animation-shared-element-id
- (fn [{:keys [db]} [animation-shared-element-id]]
-   {:db (assoc db :animation-shared-element-id animation-shared-element-id)}))
-
-(rf/reg-event-fx :lightbox/exit-lightbox-signal
- (fn [{:keys [db]} [value]]
-   {:db (assoc db :lightbox/exit-signal value)}))
-
-(rf/reg-event-fx :lightbox/zoom-out-signal
- (fn [{:keys [db]} [value]]
-   {:db (assoc db :lightbox/zoom-out-signal value)}))
-
-(rf/reg-event-fx :lightbox/orientation-change
- (fn [{:keys [db]} [value]]
-   {:db (assoc db :lightbox/orientation value)}))
-
-(rf/reg-event-fx :lightbox/lightbox-scale
- (fn [{:keys [db]} [value]]
-   {:db (assoc db :lightbox/scale value)}))
-
-(rf/reg-event-fx :lightbox/share-image
- (fn [_ [uri]]
-   {:effects.lightbox/share-image uri}))
-
-(rf/reg-event-fx :lightbox/save-image-to-gallery
- (fn [_ [uri on-success]]
-   {:effects.lightbox/save-image-to-gallery [uri on-success]}))

src/status_im/common/resources.cljs

@@ -38,9 +38,6 @@
    :no-contacts
    {:light (js/require "../resources/images/ui2/no-contacts-light.png")
     :dark  (js/require "../resources/images/ui2/no-contacts-dark.png")}
-   :no-contacts-to-chat
-   {:light (js/require "../resources/images/ui2/no-contacts-to-chat-light.png")
-    :dark  (js/require "../resources/images/ui2/no-contacts-to-chat-dark.png")}
    :keycard-chip
    {:light (js/require "../resources/images/ui2/keycard-chip-light.png")
     :dark  (js/require "../resources/images/ui2/keycard-chip-dark.png")}

src/status_im/common/router.cljs

@@ -259,6 +259,12 @@
   {:type    :wallet-account
    :account (when account (string/lower-case account))})
 
+(defn community-route-type
+  [route-params]
+  (if (string/starts-with? (:community-id route-params) "z")
+    :desktop-community
+    :community))
+
 (defn handle-uri
   [chain chats uri cb]
   (let [{:keys [handler route-params query-params]} (match-uri uri)]
@@ -291,14 +297,14 @@
       (cb {:type handler :community-id (:community-id route-params)})
 
       (and (= handler :community) (:community-id route-params))
-      (cb {:type         :community
+      (cb {:type         (community-route-type route-params)
            :community-id (:community-id route-params)})
 
       (and (= handler :community-chat) (:community-channel-id route-params) (:community-id route-params))
       (match-community-channel-async route-params cb)
 
       (and (= handler :community-chat) (:community-id route-params))
-      (cb {:type         :community
+      (cb {:type         (community-route-type route-params)
            :community-id (:community-id route-params)})
 
       ;; NOTE: removed in `match-uri`, might need this in the future

src/status_im/common/serialization.cljs

@@ -1,27 +0,0 @@
-(ns status-im.common.serialization
-  (:require
-    [native-module.core :as native-module]
-    [status-im.constants :as constants]
-    [utils.re-frame :as rf]
-    [utils.transforms :as transforms]))
-
-(rf/reg-fx :serialization/deserialize-and-compress-key
- (fn [{:keys [serialized-key on-success on-error]}]
-   (native-module/deserialize-and-compress-key
-    serialized-key
-    (fn [resp]
-      (let [{:keys [error]} (transforms/json->clj resp)]
-        (if error
-          (on-error error)
-          (on-success resp)))))))
-
-(rf/reg-fx :serialization/decompress-public-key
- (fn [{:keys [compressed-key on-success on-error]}]
-   (native-module/compressed-key->public-key
-    compressed-key
-    constants/deserialization-key
-    (fn [resp]
-      (let [{:keys [error]} (transforms/json->clj resp)]
-        (if error
-          (on-error error)
-          (on-success (str "0x" (subs resp 5)))))))))

src/status_im/common/universal_links.cljs

@@ -2,12 +2,12 @@
   (:require
     [clojure.string :as string]
     [goog.string :as gstring]
+    [native-module.core :as native-module]
     [re-frame.core :as re-frame]
     [react-native.async-storage :as async-storage]
     [react-native.core :as rn]
     [schema.core :as schema]
     [status-im.constants :as constants]
-    [status-im.contexts.communities.events :as communities.events]
     [status-im.navigation.events :as navigation]
     [taoensso.timbre :as log]
     [utils.ethereum.chain :as chain]
@@ -68,6 +68,32 @@
   (log/info "universal-links: handling community request  " community-id)
   (navigation/navigate-to cofx :community-requests-to-join {:community-id community-id}))
 
+(rf/defn handle-community
+  [cofx {:keys [community-id]}]
+  (log/info "universal-links: handling community" community-id)
+  (navigation/navigate-to cofx :community {:community-id community-id}))
+
+(rf/defn handle-navigation-to-desktop-community-from-mobile
+  {:events [:handle-navigation-to-desktop-community-from-mobile]}
+  [cofx deserialized-key]
+  (rf/merge
+   cofx
+   {:dispatch [:navigate-to :community-overview deserialized-key]}
+   (navigation/pop-to-root :shell-stack)))
+
+(rf/defn handle-desktop-community
+  [_ {:keys [community-id]}]
+  (native-module/deserialize-and-compress-key
+   community-id
+   (fn [deserialized-key]
+     (rf/dispatch [:chat.ui/fetch-community (str deserialized-key)])
+     (rf/dispatch [:handle-navigation-to-desktop-community-from-mobile (str deserialized-key)]))))
+
+(rf/defn handle-community-chat
+  [cofx {:keys [chat-id]}]
+  (log/info "universal-links: handling community chat" chat-id)
+  {:dispatch [:chat/pop-to-root-and-navigate-to-chat chat-id]})
+
 (rf/defn handle-view-profile
   [{:keys [db] :as cofx} {:keys [public-key ens-name]}]
   (log/info "universal-links: handling view profile" public-key)
@@ -117,13 +143,14 @@
 
 (rf/defn on-handle
   {:events [::match-value]}
-  [cofx url {:keys [type chat-id] :as data}]
+  [cofx url {:keys [type] :as data}]
   (case type
     :group-chat         (handle-group-chat cofx data)
     :private-chat       (handle-private-chat cofx data)
     :community-requests (handle-community-requests cofx data)
-    :community          (communities.events/navigate-to-serialized-community cofx data)
-    :community-chat     {:dispatch [:communities/navigate-to-community-chat chat-id :pop-to-root]}
+    :community          (handle-community cofx data)
+    :desktop-community  (handle-desktop-community cofx data)
+    :community-chat     (handle-community-chat cofx data)
     :contact            (handle-view-profile cofx data)
     :browser            (handle-browse cofx data)
     :eip681             (handle-eip681 cofx data)

src/status_im/config.cljs

@@ -15,11 +15,6 @@
 (goog-define ALCHEMY_OPTIMISM_GOERLI_TOKEN "")
 (goog-define ALCHEMY_OPTIMISM_MAINNET_TOKEN "")
 (goog-define ALCHEMY_ARBITRUM_MAINNET_TOKEN "")
-(goog-define ALCHEMY_ETHEREUM_SEPOLIA_TOKEN "")
-(goog-define ALCHEMY_ARBITRUM_SEPOLIA_TOKEN "")
-(goog-define ALCHEMY_OPTIMISM_SEPOLIA_TOKEN "")
-(goog-define RARIBLE_MAINNET_API_KEY "")
-(goog-define RARIBLE_TESTNET_API_KEY "")
 (goog-define OPENSEA_API_KEY "")
 
 (def mainnet-rpc-url (str "https://eth-archival.gateway.pokt.network/v1/lb/" POKT_TOKEN))

src/status_im/constants.cljs

@@ -338,13 +338,6 @@
 (def ^:const local-pairing-action-sync-device 3)
 (def ^:const local-pairing-action-pairing-installation 4)
 
-(def ^:const serialization-key
-  "We pass this serialization key as a parameter to MultiformatSerializePublicKey
-  function at status-go, This key determines the output base of the serialization.
-  according to https://specs.status.im/spec/2#public-key-serialization we serialize
-  keys with base58btc encoding"
-  "z")
-
 (def ^:const deserialization-key
   "We pass this deserialization key as a parameter to MultiformatDeserializePublicKey
   function at status-go, This key determines the output base of the deserialization.
@@ -406,14 +399,11 @@
 
 ;; wallet
 (def ^:const mainnet-chain-id 1)
-(def ^:const goerli-chain-id 5)
-(def ^:const sepolia-chain-id 11155111)
 (def ^:const optimism-chain-id 10)
-(def ^:const optimism-goerli-chain-id 420)
-(def ^:const optimism-sepolia-chain-id 11155420)
+(def ^:const optimism-test-chain-id 420)
 (def ^:const arbitrum-chain-id 42161)
-(def ^:const arbitrum-goerli-chain-id 421613)
-(def ^:const arbitrum-sepolia-chain-id 421614)
+(def ^:const arbitrum-test-chain-id 421613)
+(def ^:const goerli-chain-id 5)
 
 (def ^:const mainnet-short-name "eth")
 (def ^:const optimism-short-name "opt")

src/status_im/contexts/chat/actions/view.cljs

@@ -29,7 +29,7 @@
      {:icon                :i/add-user
       :accessibility-label :add-a-contact
       :label               (i18n/label :t/add-a-contact)
-      :sub-label           (i18n/label :t/enter-chat-key)
+      :sub-label           (i18n/label :t/enter-a-chat-key)
       :add-divider?        true
       :on-press            #(debounce/dispatch-and-chill
                              [:open-modal :new-contact]

src/status_im/contexts/chat/events.cljs

@@ -4,12 +4,13 @@
     [legacy.status-im.chat.models.loading :as loading]
     [legacy.status-im.data-store.chats :as chats-store]
     [re-frame.core :as re-frame]
-    status-im.common.lightbox.events
+    [reagent.core :as reagent]
     [status-im.common.muting.helpers :refer [format-mute-till]]
     [status-im.constants :as constants]
     [status-im.contexts.chat.contacts.events :as contacts-store]
     status-im.contexts.chat.effects
     [status-im.contexts.chat.messenger.composer.link-preview.events :as link-preview]
+    status-im.contexts.chat.messenger.lightbox.events
     status-im.contexts.chat.messenger.messages.content.reactions.events
     [status-im.contexts.chat.messenger.messages.delete-message-for-me.events :as delete-for-me]
     [status-im.contexts.chat.messenger.messages.delete-message.events :as delete-message]
@@ -393,6 +394,38 @@
   [cofx chat-id]
   (navigation/navigate-to cofx :chat-pinned-messages {:chat-id chat-id}))
 
+
+(rf/defn update-shared-element-id
+  {:events [:chat.ui/update-shared-element-id]}
+  [{:keys [db]} shared-element-id]
+  {:db (assoc db :shared-element-id shared-element-id)})
+
+(rf/defn navigate-to-lightbox
+  {:events [:chat.ui/navigate-to-lightbox]}
+  [{:keys [db]} shared-element-id screen-params]
+  (reagent/next-tick #(rf/dispatch [:navigate-to :lightbox screen-params]))
+  {:db (assoc db :shared-element-id shared-element-id)})
+
+(rf/defn exit-lightbox-signal
+  {:events [:chat.ui/exit-lightbox-signal]}
+  [{:keys [db]} value]
+  {:db (assoc db :lightbox/exit-signal value)})
+
+(rf/defn zoom-out-signal
+  {:events [:chat.ui/zoom-out-signal]}
+  [{:keys [db]} value]
+  {:db (assoc db :lightbox/zoom-out-signal value)})
+
+(rf/defn orientation-change
+  {:events [:chat.ui/orientation-change]}
+  [{:keys [db]} value]
+  {:db (assoc db :lightbox/orientation value)})
+
+(rf/defn lightbox-scale
+  {:events [:chat.ui/lightbox-scale]}
+  [{:keys [db]} value]
+  {:db (assoc db :lightbox/scale value)})
+
 (rf/defn check-last-chat
   {:events [:chat/check-last-chat]}
   [{:keys [db]}]
@@ -419,15 +452,3 @@
   {:events [:chat.ui/scroll-to-bottom]}
   [_]
   {:effects.chat/scroll-to-bottom nil})
-
-(rf/reg-event-fx :chat.ui/clear-sending-images
- (fn [{:keys [db]}]
-   {:db (update-in db [:chat/inputs (:current-chat-id db) :metadata] assoc :sending-image {})}))
-
-(rf/reg-event-fx :chat.ui/image-unselected
- (fn [{:keys [db]} [original]]
-   (let [current-chat-id (:current-chat-id db)]
-     {:db (update-in db
-                     [:chat/inputs current-chat-id :metadata :sending-image]
-                     dissoc
-                     (:uri original))})))

src/status_im/contexts/chat/home/add_new_contact/effects.cljs

@@ -1,7 +1,21 @@
 (ns status-im.contexts.chat.home.add-new-contact.effects
   (:require
     [legacy.status-im.ethereum.ens :as ens]
-    [utils.re-frame :as rf]))
+    [native-module.core :as native-module]
+    [status-im.constants :as constants]
+    [utils.re-frame :as rf]
+    [utils.transforms :as transforms]))
+
+(rf/reg-fx :effects.contacts/decompress-public-key
+ (fn [{:keys [compressed-key on-success on-error]}]
+   (native-module/compressed-key->public-key
+    compressed-key
+    constants/deserialization-key
+    (fn [resp]
+      (let [{:keys [error]} (transforms/json->clj resp)]
+        (if error
+          (on-error error)
+          (on-success (str "0x" (subs resp 5)))))))))
 
 (rf/reg-fx :effects.contacts/resolve-public-key-from-ens
  (fn [{:keys [chain-id ens on-success on-error]}]

src/status_im/contexts/chat/home/add_new_contact/events.cljs

@@ -104,7 +104,7 @@
       :empty            {:db (dissoc db :contacts/new-identity)}
       (:valid :invalid) {:db (assoc db :contacts/new-identity contact)}
       :decompress-key   {:db (assoc db :contacts/new-identity contact)
-                         :serialization/decompress-public-key
+                         :effects.contacts/decompress-public-key
                          {:compressed-key id
                           :on-success
                           (dispatcher :contacts/set-new-identity-success input)

src/status_im/contexts/chat/home/add_new_contact/events_test.cljs

@@ -132,7 +132,7 @@
                              :type            :compressed-key
                              :public-key      nil ; not yet...
                              :state           :decompress-key}))
-                :serialization/decompress-public-key
+                :effects.contacts/decompress-public-key
                 {:compressed-key user-ckey
                  :on-success     [:contacts/set-new-identity-success user-ckey]
                  :on-error       [:contacts/set-new-identity-error user-ckey]}})))

src/status_im/contexts/chat/home/add_new_contact/style.cljs

@@ -21,7 +21,7 @@
   []
   {:size   :heading-1
    :weight :semi-bold
-   :style  {:margin-top    28
+   :style  {:margin-top    32
             :margin-bottom 6
             :color         (colors/theme-colors colors/neutral-100 colors/white)}})
 

src/status_im/contexts/chat/home/new_chat/view.cljs

@@ -16,38 +16,33 @@
 
 (defn- no-contacts-view
   [{:keys [theme]}]
-  (let [customization-color (rf/sub [:profile/customization-color])]
-    [rn/view
-     {:style (style/no-contacts)}
-     [rn/image {:source (resources/get-themed-image :no-contacts-to-chat theme)}]
-     [quo/text
-      {:weight :semi-bold
-       :size   :paragraph-1
-       :style  {:margin-bottom 2
-                :margin-top    12}}
-      (i18n/label :t/you-have-no-contacts)]
-     [quo/text
-      {:weight :regular
-       :size   :paragraph-2}
-      (i18n/label :t/dont-yell-at-me)]
-     [quo/button
-      {:customization-color customization-color
-       :theme               theme
-       :type                :primary
-       :size                32
-       :container-style     {:margin-top    20
-                             :margin-bottom 12}
-       :on-press            #(rf/dispatch [:invite.events/share-link])}
-      (i18n/label :t/invite-friends)]
-     [quo/button
-      {:customization-color customization-color
-       :theme               theme
-       :type                :grey
-       :size                32
-       :on-press            #(do
-                               (rf/dispatch [:navigate-back])
-                               (rf/dispatch [:open-modal :new-contact]))}
-      (i18n/label :t/add-a-contact)]]))
+  [rn/view
+   {:style (style/no-contacts)}
+   [rn/image {:source (resources/get-themed-image :no-contacts theme)}]
+   [quo/text
+    {:weight :semi-bold
+     :size   :paragraph-1
+     :style  {:margin-bottom 2
+              :margin-top    12}}
+    (i18n/label :t/you-have-no-contacts)]
+   [quo/text
+    {:weight :regular
+     :size   :label}
+    (i18n/label :t/dont-yell-at-me)]
+   [quo/button
+    {:type            :primary
+     :size            32
+     :container-style {:margin-top    20
+                       :margin-bottom 12}
+     :on-press        #(rf/dispatch [:invite.events/share-link])}
+    (i18n/label :t/invite-friends)]
+   [quo/button
+    {:type     :grey
+     :size     32
+     :on-press #(do
+                  (rf/dispatch [:navigate-back])
+                  (rf/dispatch [:open-modal :new-contact]))}
+    (i18n/label :t/add-a-contact)]])
 
 (defn contact-item-render
   [_]

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

@@ -73,7 +73,7 @@
                                               :shared-value scroll-shared-value})}])))
 
 (defn contact-item-render
-  [{:keys [public-key] :as item} theme]
+  [{:keys [public-key] :as item}]
   (let [current-pk           (rf/sub [:multiaccount/public-key])
         show-profile-actions #(rf/dispatch [:show-bottom-sheet
                                             {:content (fn [] [actions/contact-actions item])}])]
@@ -83,8 +83,7 @@
         :on-long-press show-profile-actions
         :accessory     {:type     :options
                         :on-press show-profile-actions}})
-     item
-     theme]))
+     item]))
 
 (defn contacts
   [{:keys [theme pending-contact-requests set-scroll-ref scroll-shared-value]}]
@@ -106,8 +105,7 @@
         :sections                          items
         :sticky-section-headers-enabled    false
         :render-section-header-fn          contact-list/contacts-section-header
-        :render-fn                         (fn [data]
-                                             (contact-item-render data theme))
+        :render-fn                         contact-item-render
         :scroll-event-throttle             8
         :on-scroll                         #(common.banner/set-scroll-shared-value
                                              {:scroll-input (oops/oget % "nativeEvent.contentOffset.y")

src/status_im/contexts/chat/messenger/composer/actions/view.cljs

@@ -30,7 +30,7 @@
   (js/setTimeout #(reanimated/set-shared-value background-y
                                                (- window-height))
                  300)
-  (rf/dispatch [:chat.ui/send-current-message])
+  (rf/dispatch [:chat.ui/replace-mentions-and-send-current-message])
   (rf/dispatch [:chat.ui/set-input-maximized false])
   (rf/dispatch [:chat.ui/set-input-content-height comp-constants/input-height])
   (rf/dispatch [:chat.ui/set-chat-input-text nil])

src/status_im/contexts/chat/messenger/composer/effects.cljs

@@ -114,8 +114,9 @@
   [{:keys [input-ref]}
    {:keys [text-value saved-cursor-position cursor-position]}
    {:keys [edit input-with-mentions]}
-   chat-screen-layout-calculations-complete?]
-  (let [mention? (some #(= :mention (first %)) (seq input-with-mentions))]
+   messages-list-on-layout-finished?]
+  (let [mention?              (some #(= :mention (first %)) (seq input-with-mentions))
+        composer-just-opened? (not @messages-list-on-layout-finished?)]
     (rn/use-effect
      (fn []
        (let [mention-text     (reduce (fn [acc item]
@@ -127,9 +128,7 @@
                                 ;; NOTE: using text-value for cases when the user
                                 ;; leaves the app with an unfinished edit and re-opens
                                 ;; the chat.
-                                (and (seq @text-value)
-                                     (not (reanimated/get-shared-value
-                                           chat-screen-layout-calculations-complete?)))
+                                (and (seq @text-value) composer-just-opened?)
                                 @text-value
                                 :else (get-in edit [:content :text]))
              selection-pos    (count edit-text)
@@ -151,9 +150,7 @@
            ;; UI. This way, `on-focus` will trigger first without changing the height, after which
            ;; `on-content-size-change` will animate the height of the input based on the injected
            ;; text.
-           (js/setTimeout #(do (when (reanimated/get-shared-value
-                                      chat-screen-layout-calculations-complete?)
-                                 (.focus ^js @input-ref))
+           (js/setTimeout #(do (when @messages-list-on-layout-finished? (.focus ^js @input-ref))
                                (reagent/next-tick inject-edit-text))
                           600))))
      [(:message-id edit)])))
@@ -162,12 +159,12 @@
   [{:keys [input-ref]}
    {:keys [container-opacity]}
    {:keys [reply]}
-   chat-screen-layout-calculations-complete?]
+   messages-list-on-layout-finished?]
   (rn/use-effect
    (fn []
      (when reply
        (reanimated/animate container-opacity 1))
-     (when (and reply @input-ref (reanimated/get-shared-value chat-screen-layout-calculations-complete?))
+     (when (and reply @input-ref @messages-list-on-layout-finished?)
        (js/setTimeout #(.focus ^js @input-ref) 600)))
    [(:message-id reply)]))
 

src/status_im/contexts/chat/messenger/composer/events.cljs

@@ -207,12 +207,24 @@
    (link-preview/reset-unfurled)
    (cancel-message-edit)))
 
-(rf/defn send-current-message
+(rf/defn replace-mentions-and-send-current-message
   "Sends message from current chat input"
-  {:events [:chat.ui/send-current-message]}
-  [{{:keys [current-chat-id] :as db} :db :as cofx}]
-  (let [{:keys [input-text metadata]} (get-in db [:chat/inputs current-chat-id])
-        editing-message               (:editing-message metadata)]
-    (if editing-message
-      (send-edited-message cofx input-text editing-message)
-      (send-messages cofx input-text current-chat-id))))
+  {:events [:chat.ui/replace-mentions-and-send-current-message]}
+  [{{:keys [current-chat-id] :as db} :db}]
+  (let [{:keys [input-text metadata]} (get-in db [:chat/inputs current-chat-id])]
+    {:json-rpc/call [{:method     "wakuext_chatMentionReplaceWithPublicKey"
+                      :params     [current-chat-id input-text]
+                      :on-error   #(log/error "[wakuext_chatMentionReplaceWithPublicKey] on-error" %)
+                      :on-success #(rf/dispatch [:chat.ui/send-current-message-with-mentions
+                                                 current-chat-id
+                                                 (:editing-message metadata)
+                                                 input-text
+                                                 %])}]}))
+
+(rf/defn send-current-message-with-mentions
+  {:events [:chat.ui/send-current-message-with-mentions]}
+  [{:keys [db] :as cofx} current-chat-id editing-message input-text new-text]
+  (rf/merge cofx
+            (if editing-message
+              (send-edited-message new-text editing-message)
+              (send-messages new-text current-chat-id))))

src/status_im/contexts/chat/messenger/composer/view.cljs

@@ -31,12 +31,12 @@
 (defn sheet-component
   [{:keys [insets
            chat-list-scroll-y
-           chat-screen-layout-calculations-complete?
            window-height
            blur-height
            opacity
            background-y
-           theme]} props state]
+           theme
+           messages-list-on-layout-finished?]} props state]
   (let [subscriptions            (utils/init-subs)
         content-height           (reagent/atom (or (:input-content-height ; Actual text height
                                                     subscriptions)
@@ -75,8 +75,8 @@
                         animations
                         dimensions
                         subscriptions)
-    (effects/use-edit props state subscriptions chat-screen-layout-calculations-complete?)
-    (effects/use-reply props animations subscriptions chat-screen-layout-calculations-complete?)
+    (effects/use-edit props state subscriptions messages-list-on-layout-finished?)
+    (effects/use-reply props animations subscriptions messages-list-on-layout-finished?)
     (effects/update-input-mention props state subscriptions)
     (effects/link-previews props state animations subscriptions)
     (effects/use-images props state animations subscriptions)
@@ -145,20 +145,22 @@
         [:f> actions/view props state animations window-height insets subscriptions]]]]]))
 
 (defn f-composer
-  [props]
+  [{:keys [insets chat-list-scroll-y messages-list-on-layout-finished?]}]
   (let [window-height (:height (rn/get-window))
         theme         (quo.theme/use-theme-value)
         opacity       (reanimated/use-shared-value 0)
         background-y  (reanimated/use-shared-value (- window-height)) ; Y position of background
                                                                       ; overlay
         blur-height   (reanimated/use-shared-value (+ constants/composer-default-height
-                                                      (:bottom (:insets props))))
-        extra-params  (assoc props
-                             :window-height window-height
-                             :blur-height   blur-height
-                             :opacity       opacity
-                             :background-y  background-y
-                             :theme         theme)
+                                                      (:bottom insets)))
+        extra-params  {:insets                            insets
+                       :window-height                     window-height
+                       :chat-list-scroll-y                chat-list-scroll-y
+                       :blur-height                       blur-height
+                       :opacity                           opacity
+                       :background-y                      background-y
+                       :theme                             theme
+                       :messages-list-on-layout-finished? messages-list-on-layout-finished?}
         props         (utils/init-non-reactive-state)
         state         (utils/init-reactive-state)]
     [rn/view (when platform/ios? {:style {:z-index 1}})

src/status_im/contexts/chat/messenger/lightbox/animations.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.animations
+(ns status-im.contexts.chat.messenger.lightbox.animations
   (:require
     [react-native.reanimated :as reanimated]))
 

src/status_im/contexts/chat/messenger/lightbox/bottom_view.cljs

@@ -1,25 +1,25 @@
-(ns status-im.common.lightbox.bottom-view
+(ns status-im.contexts.chat.messenger.lightbox.bottom-view
   (:require
     [quo.foundations.colors :as colors]
     [react-native.core :as rn]
     [react-native.platform :as platform]
     [react-native.reanimated :as reanimated]
-    [status-im.common.lightbox.animations :as anim]
-    [status-im.common.lightbox.constants :as constants]
-    [status-im.common.lightbox.style :as style]
-    [status-im.common.lightbox.text-sheet.view :as text-sheet]
+    [status-im.contexts.chat.messenger.lightbox.animations :as anim]
+    [status-im.contexts.chat.messenger.lightbox.constants :as c]
+    [status-im.contexts.chat.messenger.lightbox.style :as style]
+    [status-im.contexts.chat.messenger.lightbox.text-sheet.view :as text-sheet]
     [utils.re-frame :as rf]))
 
 (defn get-small-item-layout
   [_ index]
   #js
-   {:length constants/small-image-size
-    :offset (* (+ constants/small-image-size 8) index)
+   {:length c/small-image-size
+    :offset (* (+ c/small-image-size 8) index)
     :index  index})
 
 (defn- f-small-image
   [item index _ {:keys [scroll-index props]}]
-  (let [size (if (= @scroll-index index) constants/focused-image-size constants/small-image-size)
+  (let [size (if (= @scroll-index index) c/focused-image-size c/small-image-size)
         size-value (anim/use-val size)
         {:keys [scroll-index-lock? small-list-ref flat-list-ref]}
         props]
@@ -27,7 +27,7 @@
     [rn/touchable-opacity
      {:active-opacity 1
       :on-press       (fn []
-                        (rf/dispatch [:lightbox/zoom-out-signal @scroll-index])
+                        (rf/dispatch [:chat.ui/zoom-out-signal @scroll-index])
                         (reset! scroll-index-lock? true)
                         (js/setTimeout #(reset! scroll-index-lock? false) 500)
                         (js/setTimeout
@@ -38,9 +38,9 @@
                            (.scrollToIndex ^js @flat-list-ref
                                            #js {:animated true :index index}))
                          (if platform/ios? 50 150))
-                        (rf/dispatch [:lightbox/update-animation-shared-element-id (:id item)]))}
+                        (rf/dispatch [:chat.ui/update-shared-element-id (:message-id item)]))}
      [reanimated/fast-image
-      {:source {:uri (:image item)}
+      {:source {:uri (:image (:content item))}
        :style  (reanimated/apply-animations-to-style {:width  size-value
                                                       :height size-value}
                                                      {:border-radius 10})}]]))
@@ -50,26 +50,20 @@
   [:f> f-small-image item index _ render-data])
 
 (defn bottom-view
-  [{:keys [images index scroll-index insets animations derived item-width props state transparent?
-           bottom-text-component]}]
-  (let [padding-horizontal (- (/ item-width 2) (/ constants/focused-image-size 2))]
+  [messages index scroll-index insets animations derived item-width props state transparent?]
+  (let [padding-horizontal (- (/ item-width 2) (/ c/focused-image-size 2))]
     [reanimated/linear-gradient
      {:colors   [colors/neutral-100-opa-100 colors/neutral-100-opa-80 colors/neutral-100-opa-0]
       :location [0.2 0.9]
       :start    {:x 0 :y 1}
       :end      {:x 0 :y 0}
       :style    (style/gradient-container insets animations derived transparent?)}
-     (when bottom-text-component
-       [text-sheet/view
-        {:overlay-opacity  (:overlay-opacity animations)
-         :overlay-z-index  (:overlay-z-index state)
-         :text-sheet-lock? (:text-sheet-lock? props)
-         :text-component   bottom-text-component}])
+     [text-sheet/view messages animations state props]
      [rn/flat-list
       {:ref                               #(reset! (:small-list-ref props) %)
-       :key-fn                            :id
-       :style                             {:height constants/small-list-height}
-       :data                              images
+       :key-fn                            :message-id
+       :style                             {:height c/small-list-height}
+       :data                              messages
        :render-fn                         small-image
        :render-data                       {:scroll-index scroll-index
                                            :props        props}

src/status_im/contexts/chat/messenger/lightbox/constants.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.constants)
+(ns status-im.contexts.chat.messenger.lightbox.constants)
 
 (def ^:const small-image-size 40)
 (def ^:const focused-extra-size 16)

src/status_im/contexts/chat/messenger/lightbox/effects.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.effects
+(ns status-im.contexts.chat.messenger.lightbox.effects
   (:require [react-native.blob :as blob]
             [react-native.cameraroll :as cameraroll]
             [react-native.fs :as fs]
@@ -10,7 +10,7 @@
   {:trusty platform/ios?
    :path   (str (fs/cache-dir) "/StatusIm_Image.jpeg")})
 
-(rf/reg-fx :effects.lightbox/share-image
+(rf/reg-fx :effects.chat/share-image
  (fn [uri]
    (blob/fetch uri
                config
@@ -20,7 +20,7 @@
                              #(fs/unlink downloaded-url)
                              #(fs/unlink downloaded-url))))))
 
-(rf/reg-fx :effects.lightbox/save-image-to-gallery
+(rf/reg-fx :effects.chat/save-image-to-gallery
  (fn [[uri on-success]]
    (blob/fetch uri
                config

src/status_im/contexts/chat/messenger/lightbox/events.cljs

@@ -0,0 +1,23 @@
+(ns status-im.contexts.chat.messenger.lightbox.events
+  (:require status-im.contexts.chat.messenger.lightbox.effects
+            [utils.re-frame :as rf]))
+
+(rf/reg-event-fx :chat.ui/clear-sending-images
+ (fn [{:keys [db]}]
+   {:db (update-in db [:chat/inputs (:current-chat-id db) :metadata] assoc :sending-image {})}))
+
+(rf/reg-event-fx :chat.ui/image-unselected
+ (fn [{:keys [db]} [original]]
+   (let [current-chat-id (:current-chat-id db)]
+     {:db (update-in db
+                     [:chat/inputs current-chat-id :metadata :sending-image]
+                     dissoc
+                     (:uri original))})))
+
+(rf/reg-event-fx :chat.ui/share-image
+ (fn [_ [uri]]
+   {:effects.chat/share-image uri}))
+
+(rf/reg-event-fx :chat.ui/save-image-to-gallery
+ (fn [_ [uri on-success]]
+   {:effects.chat/save-image-to-gallery [uri on-success]}))

src/status_im/contexts/chat/messenger/lightbox/style.cljs

@@ -1,9 +1,9 @@
-(ns status-im.common.lightbox.style
+(ns status-im.contexts.chat.messenger.lightbox.style
   (:require
     [quo.foundations.colors :as colors]
     [react-native.platform :as platform]
     [react-native.reanimated :as reanimated]
-    [status-im.common.lightbox.constants :as constants]))
+    [status-im.contexts.chat.messenger.lightbox.constants :as c]))
 
 ;;;; VIEW
 (defn image
@@ -33,7 +33,7 @@
    {:position           :absolute
     :padding-horizontal 20
     :top                (if (or platform/ios? (not landscape?)) top-inset 0)
-    :height             constants/top-view-height
+    :height             c/top-view-height
     :z-index            4
     :flex-direction     :row
     :justify-content    :space-between
@@ -44,7 +44,7 @@
 (defn top-gradient
   [insets]
   {:position :absolute
-   :height   (+ constants/top-view-height (:top insets) 0)
+   :height   (+ c/top-view-height (:top insets) 0)
    :top      (- (:top insets))
    :left     0
    :right    0})
@@ -71,12 +71,12 @@
     :display        (if @transparent? :none :flex)
     :bottom         0
     :padding-bottom (:bottom insets)
-    :padding-top    constants/text-min-height
+    :padding-top    c/text-min-height
     :z-index        3}))
 
 (defn content-container
   [padding-horizontal]
-  {:padding-vertical   constants/small-list-padding-vertical
+  {:padding-vertical   c/small-list-padding-vertical
    :padding-horizontal padding-horizontal
    :align-items        :center
    :justify-content    :center})

src/status_im/contexts/chat/messenger/lightbox/text_sheet/style.cljs

@@ -1,8 +1,8 @@
-(ns status-im.common.lightbox.text-sheet.style
+(ns status-im.contexts.chat.messenger.lightbox.text-sheet.style
   (:require
     [quo.foundations.colors :as colors]
     [react-native.reanimated :as reanimated]
-    [status-im.common.lightbox.constants :as constants]))
+    [status-im.contexts.chat.messenger.lightbox.constants :as constants]))
 
 (defn sheet-container
   [{:keys [height top]}]
@@ -14,10 +14,10 @@
     :right    0}))
 
 (defn text-style
-  [expandable-text?]
+  [expanding-message?]
   {:color             colors/white
    :margin-horizontal 20
-   :align-items       (when-not expandable-text? :center)
+   :align-items       (when-not expanding-message? :center)
    :flex-grow         1})
 
 (def bar-container

src/status_im/contexts/chat/messenger/lightbox/text_sheet/utils.cljs

@@ -1,10 +1,10 @@
-(ns status-im.common.lightbox.text-sheet.utils
+(ns status-im.contexts.chat.messenger.lightbox.text-sheet.utils
   (:require
     [oops.core :as oops]
     [react-native.gesture :as gesture]
     [react-native.reanimated :as reanimated]
     [reagent.core :as r]
-    [status-im.common.lightbox.constants :as constants]))
+    [status-im.contexts.chat.messenger.lightbox.constants :as constants]))
 
 (defn- collapse-sheet
   [{:keys [derived-value overlay-opacity saved-top expanded? overlay-z-index]}]
@@ -16,10 +16,10 @@
 
 (defn sheet-gesture
   [{:keys [derived-value saved-top overlay-opacity gradient-opacity]}
-   expanded-height max-height full-height overlay-z-index expanded? dragging? expandable-text?]
+   expanded-height max-height full-height overlay-z-index expanded? dragging? expanding-message?]
   (let [disable-gesture-update (r/atom false)]
     (-> (gesture/gesture-pan)
-        (gesture/enabled expandable-text?)
+        (gesture/enabled expanding-message?)
         (gesture/on-start (fn []
                             (reset! overlay-z-index 1)
                             (reset! dragging? true)

src/status_im/contexts/chat/messenger/lightbox/text_sheet/view.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.text-sheet.view
+(ns status-im.contexts.chat.messenger.lightbox.text-sheet.view
   (:require
     [quo.foundations.colors :as colors]
     [react-native.core :as rn]
@@ -8,31 +8,33 @@
     [react-native.reanimated :as reanimated]
     [react-native.safe-area :as safe-area]
     [reagent.core :as reagent]
-    [status-im.common.lightbox.constants :as constants]
-    [status-im.common.lightbox.text-sheet.style :as style]
-    [status-im.common.lightbox.text-sheet.utils :as utils]))
+    [status-im.contexts.chat.messenger.lightbox.constants :as constants]
+    [status-im.contexts.chat.messenger.lightbox.text-sheet.style :as style]
+    [status-im.contexts.chat.messenger.lightbox.text-sheet.utils :as utils]
+    [status-im.contexts.chat.messenger.messages.content.text.view :as message-view]))
 
 (defn- text-sheet
-  [_]
+  [messages overlay-opacity overlay-z-index text-sheet-lock?]
   (let [text-height (reagent/atom 0)
         expanded?   (reagent/atom false)
         dragging?   (atom false)]
-    (fn [{:keys [overlay-opacity overlay-z-index text-sheet-lock? text-component]}]
-      (let [insets           (safe-area/get-insets)
-            window-height    (:height (rn/get-window))
-            max-height       (- window-height
-                                constants/text-min-height
-                                constants/top-view-height
-                                (:bottom insets)
-                                (when platform/ios? (:top insets)))
-            full-height      (+ constants/bar-container-height
-                                constants/text-margin
-                                constants/line-height
-                                @text-height)
-            expanded-height  (min max-height full-height)
-            animations       (utils/init-animations overlay-opacity)
-            derived          (utils/init-derived-animations animations)
-            expandable-text? (> @text-height (* constants/line-height 2))]
+    (fn []
+      (let [{:keys [chat-id content]} (first messages)
+            insets                    (safe-area/get-insets)
+            window-height             (:height (rn/get-window))
+            max-height                (- window-height
+                                         constants/text-min-height
+                                         constants/top-view-height
+                                         (:bottom insets)
+                                         (when platform/ios? (:top insets)))
+            full-height               (+ constants/bar-container-height
+                                         constants/text-margin
+                                         constants/line-height
+                                         @text-height)
+            expanded-height           (min max-height full-height)
+            animations                (utils/init-animations overlay-opacity)
+            derived                   (utils/init-derived-animations animations)
+            expanding-message?        (> @text-height (* constants/line-height 2))]
         [rn/view
          [reanimated/linear-gradient
           {:colors         [colors/neutral-100-opa-0 colors/neutral-100]
@@ -49,10 +51,10 @@
                                          overlay-z-index
                                          expanded?
                                          dragging?
-                                         expandable-text?)}
+                                         expanding-message?)}
           [gesture/gesture-detector
            {:gesture (-> (gesture/gesture-tap)
-                         (gesture/enabled (and expandable-text? (not @expanded?)))
+                         (gesture/enabled (and expanding-message? (not @expanded?)))
                          (gesture/on-start (fn []
                                              (utils/expand-sheet animations
                                                                  expanded-height
@@ -61,7 +63,7 @@
                                                                  expanded?
                                                                  text-sheet-lock?))))}
            [reanimated/view {:style (style/sheet-container derived)}
-            (when expandable-text?
+            (when expanding-message?
               [rn/view {:style style/bar-container}
                [rn/view {:style style/bar}]])
             [linear-gradient/linear-gradient
@@ -70,17 +72,19 @@
               :end       {:x 0 :y 0}
               :locations [0.7 0.8 1]
               :style     (style/bottom-gradient (:bottom insets))}]
-
             [gesture/scroll-view
              {:scroll-enabled          false
               :scroll-event-throttle   16
               :bounces                 false
               :style                   {:height (- max-height constants/bar-container-height)}
-              :content-container-style {:padding-top (when (not expandable-text?)
+              :content-container-style {:padding-top (when (not expanding-message?)
                                                        constants/bar-container-height)}}
-             [rn/view {:on-layout #(utils/on-layout % text-height)}
-              text-component]]]]]]))))
+             [message-view/render-parsed-text
+              {:content        content
+               :chat-id        chat-id
+               :style-override (style/text-style expanding-message?)
+               :on-layout      #(utils/on-layout % text-height)}]]]]]]))))
 
 (defn view
-  [props]
-  [:f> text-sheet props])
+  [messages {:keys [overlay-opacity]} {:keys [overlay-z-index]} {:keys [text-sheet-lock?]}]
+  [:f> text-sheet messages overlay-opacity overlay-z-index text-sheet-lock?])

src/status_im/contexts/chat/messenger/lightbox/top_view.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.top-view
+(ns status-im.contexts.chat.messenger.lightbox.top-view
   (:require
     [quo.core :as quo]
     [quo.foundations.colors :as colors]
@@ -6,9 +6,10 @@
     [react-native.orientation :as orientation]
     [react-native.platform :as platform]
     [react-native.reanimated :as reanimated]
-    [status-im.common.lightbox.animations :as anim]
-    [status-im.common.lightbox.constants :as constants]
-    [status-im.common.lightbox.style :as style]
+    [status-im.contexts.chat.messenger.lightbox.animations :as anim]
+    [status-im.contexts.chat.messenger.lightbox.constants :as c]
+    [status-im.contexts.chat.messenger.lightbox.style :as style]
+    [utils.datetime :as datetime]
     [utils.i18n :as i18n]
     [utils.re-frame :as rf]
     [utils.url :as url]))
@@ -16,7 +17,7 @@
 (defn animate-rotation
   [result screen-width screen-height insets
    {:keys [rotate top-view-y top-view-x top-view-width top-view-bg]}]
-  (let [top-x (+ (/ constants/top-view-height 2) (:top insets))]
+  (let [top-x (+ (/ c/top-view-height 2) (:top insets))]
     (cond
       (= result orientation/landscape-left)
       (do
@@ -41,9 +42,9 @@
         (anim/animate top-view-bg colors/neutral-100-opa-0)))))
 
 (defn drawer
-  [images index]
-  (let [{:keys [image]} (nth images index)
-        uri             (url/replace-port image (rf/sub [:mediaserver/port]))]
+  [messages index]
+  (let [{:keys [content]} (nth messages index)
+        uri               (url/replace-port (:image content) (rf/sub [:mediaserver/port]))]
     [quo/action-drawer
      [[{:icon                :i/save
         :accessibility-label :save-image
@@ -51,7 +52,7 @@
         :on-press            (fn []
                                (rf/dispatch [:hide-bottom-sheet])
                                (rf/dispatch
-                                [:lightbox/save-image-to-gallery
+                                [:chat.ui/save-image-to-gallery
                                  uri
                                  #(rf/dispatch [:toasts/upsert
                                                 {:id              :random-id
@@ -60,19 +61,20 @@
                                                  :text            (i18n/label :t/photo-saved)}])]))}]]]))
 
 (defn share-image
-  [images index]
-  (let [{:keys [image]} (nth images index)
-        uri             (url/replace-port image (rf/sub [:mediaserver/port]))]
-    (rf/dispatch [:lightbox/share-image uri])))
+  [messages index]
+  (let [{:keys [content]} (nth messages index)
+        uri               (url/replace-port (:image content) (rf/sub [:mediaserver/port]))]
+    (rf/dispatch [:chat.ui/share-image uri])))
 
 (defn top-view
-  [images insets index animations derived landscape? screen-width]
-  (let [{:keys [description header]} (nth images @index)
-        bg-color                     (if landscape?
-                                       colors/neutral-100-opa-70
-                                       colors/neutral-100-opa-0)
+  [messages insets index animations derived landscape? screen-width]
+  (let [{:keys [from timestamp]}  (first messages)
+        [primary-name _]          (rf/sub [:contacts/contact-two-names-by-identity from])
+        bg-color                  (if landscape?
+                                    colors/neutral-100-opa-70
+                                    colors/neutral-100-opa-0)
         {:keys [background-color opacity
-                overlay-opacity]}    animations]
+                overlay-opacity]} animations]
     [reanimated/view
      {:style
       (style/top-view-container (:top insets) screen-width bg-color landscape? animations derived)}
@@ -90,7 +92,7 @@
                     (anim/animate opacity 0)
                     (anim/animate overlay-opacity 0)
                     (rf/dispatch (if platform/ios?
-                                   [:lightbox/exit-lightbox-signal @index]
+                                   [:chat.ui/exit-lightbox-signal @index]
                                    [:navigate-back])))
         :style    style/close-container}
        [quo/icon :close {:size 20 :color colors/white}]]
@@ -98,22 +100,22 @@
        [quo/text
         {:weight :semi-bold
          :size   :paragraph-1
-         :style  {:color colors/white}} header]
+         :style  {:color colors/white}} primary-name]
        [quo/text
         {:weight :medium
          :size   :paragraph-2
-         :style  {:color colors/neutral-40}} description]]]
+         :style  {:color colors/neutral-40}} (when timestamp (datetime/to-short-str timestamp))]]]
      [rn/view {:style style/top-right-buttons}
       [rn/touchable-opacity
        {:active-opacity      1
         :accessibility-label :share-image
-        :on-press            #(share-image images @index)
+        :on-press            #(share-image messages @index)
         :style               (merge style/close-container {:margin-right 12})}
        [quo/icon :share {:size 20 :color colors/white}]]
       [rn/touchable-opacity
        {:active-opacity      1
         :accessibility-label :image-options
         :on-press            #(rf/dispatch [:show-bottom-sheet
-                                            {:content (fn [] [drawer images @index])}])
+                                            {:content (fn [] [drawer messages @index])}])
         :style               style/close-container}
        [quo/icon :options {:size 20 :color colors/white}]]]]))

src/status_im/contexts/chat/messenger/lightbox/utils.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.utils
+(ns status-im.contexts.chat.messenger.lightbox.utils
   (:require
     [clojure.string :as string]
     [oops.core :as oops]
@@ -9,9 +9,9 @@
     [react-native.platform :as platform]
     [react-native.safe-area :as safe-area]
     [reagent.core :as reagent]
-    [status-im.common.lightbox.animations :as anim]
-    [status-im.common.lightbox.constants :as constants]
-    [status-im.common.lightbox.top-view :as top-view]
+    [status-im.contexts.chat.messenger.lightbox.animations :as anim]
+    [status-im.contexts.chat.messenger.lightbox.constants :as constants]
+    [status-im.contexts.chat.messenger.lightbox.top-view :as top-view]
     [utils.re-frame :as rf]
     [utils.worklets.chat.messenger.lightbox :as worklet]))
 
@@ -46,7 +46,7 @@
                       (if platform/ios? 250 100)))
      (swap! timers assoc :mount-index-lock (js/setTimeout #(reset! scroll-index-lock? false) 300))
      (fn []
-       (rf/dispatch [:lightbox/zoom-out-signal nil])
+       (rf/dispatch [:chat.ui/zoom-out-signal nil])
        (when platform/android?
          (rf/dispatch [:chat.ui/lightbox-scale 1]))
        (clear-timers timers)))))
@@ -69,7 +69,7 @@
         landscape?    (string/includes? result orientation/landscape)
         item-width    (if (and landscape? platform/ios?) screen-height screen-width)]
     (when (or landscape? (= result orientation/portrait))
-      (rf/dispatch [:lightbox/orientation-change result]))
+      (rf/dispatch [:chat.ui/orientation-change result]))
     (cond
       landscape?
       (orientation/lock-to-landscape "lightbox")
@@ -148,11 +148,11 @@
    :timers             (atom {})})
 
 (defn init-state
-  [images index]
+  [messages index]
   ;; The initial value of data is the image that was pressed (and not the whole album) in order
   ;; for the transition animation to execute properly, otherwise it would animate towards
   ;; outside the screen (even if we have `initialScrollIndex` set).
-  {:data             (reagent/atom (if (number? index) [(nth images index)] []))
+  {:data             (reagent/atom (if (number? index) [(nth messages index)] []))
    :scroll-index     (reagent/atom index)
    :transparent?     (reagent/atom false)
    :set-full-height? (reagent/atom false)

src/status_im/contexts/chat/messenger/lightbox/view.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.view
+(ns status-im.contexts.chat.messenger.lightbox.view
   (:require
     [clojure.string :as string]
     [oops.core :as oops]
@@ -9,13 +9,13 @@
     [react-native.platform :as platform]
     [react-native.reanimated :as reanimated]
     [react-native.safe-area :as safe-area]
-    [status-im.common.lightbox.animations :as anim]
-    [status-im.common.lightbox.bottom-view :as bottom-view]
-    [status-im.common.lightbox.constants :as constants]
-    [status-im.common.lightbox.style :as style]
-    [status-im.common.lightbox.top-view :as top-view]
-    [status-im.common.lightbox.utils :as utils]
-    [status-im.common.lightbox.zoomable-image.view :as zoomable-image]
+    [status-im.contexts.chat.messenger.lightbox.animations :as anim]
+    [status-im.contexts.chat.messenger.lightbox.bottom-view :as bottom-view]
+    [status-im.contexts.chat.messenger.lightbox.constants :as constants]
+    [status-im.contexts.chat.messenger.lightbox.style :as style]
+    [status-im.contexts.chat.messenger.lightbox.top-view :as top-view]
+    [status-im.contexts.chat.messenger.lightbox.utils :as utils]
+    [status-im.contexts.chat.messenger.lightbox.zoomable-image.view :as zoomable-image]
     [utils.re-frame :as rf]))
 
 (defn get-item-layout
@@ -33,10 +33,9 @@
       (reset! scroll-index index)
       (when @small-list-ref
         (.scrollToIndex ^js @small-list-ref #js {:animated true :index index}))
-      (rf/dispatch [:lightbox/update-animation-shared-element-id
-                    (:id (oops/oget changed :item))]))))
+      (rf/dispatch [:chat.ui/update-shared-element-id (:message-id (oops/oget changed :item))]))))
 
-(defn image-view
+(defn image
   [message index _ {:keys [screen-width screen-height] :as args}]
   [rn/view
    {:style (style/image (+ screen-width constants/separator-width) screen-height)}
@@ -44,31 +43,30 @@
    [rn/view {:style {:width constants/separator-width}}]])
 
 (defn lightbox-content
-  [{:keys [props state animations derived images index handle-items-changed bottom-text-component]}]
-  (let [{:keys [data transparent? scroll-index
-                set-full-height?]} state
-        insets                     (safe-area/get-insets)
-        window                     (rn/get-window)
-        window-width               (:width window)
-        window-height              (if platform/android?
-                                     (+ (:height window) (:top insets))
-                                     (:height window))
-        curr-orientation           (or (rf/sub [:lightbox/orientation]) orientation/portrait)
-        landscape?                 (string/includes? curr-orientation orientation/landscape)
-        horizontal?                (or platform/android? (not landscape?))
-        inverted?                  (and platform/ios? (= curr-orientation orientation/landscape-right))
-        screen-width               (if (or platform/ios? (= curr-orientation orientation/portrait))
-                                     window-width
-                                     window-height)
-        screen-height              (if (or platform/ios? (= curr-orientation orientation/portrait))
-                                     window-height
-                                     window-width)
-        item-width                 (if (and landscape? platform/ios?) screen-height screen-width)]
+  [props {:keys [data transparent? scroll-index set-full-height?] :as state}
+   animations derived messages index handle-items-changed]
+  (let [insets           (safe-area/get-insets)
+        window           (rn/get-window)
+        window-width     (:width window)
+        window-height    (if platform/android?
+                           (+ (:height window) (:top insets))
+                           (:height window))
+        curr-orientation (or (rf/sub [:lightbox/orientation]) orientation/portrait)
+        landscape?       (string/includes? curr-orientation orientation/landscape)
+        horizontal?      (or platform/android? (not landscape?))
+        inverted?        (and platform/ios? (= curr-orientation orientation/landscape-right))
+        screen-width     (if (or platform/ios? (= curr-orientation orientation/portrait))
+                           window-width
+                           window-height)
+        screen-height    (if (or platform/ios? (= curr-orientation orientation/portrait))
+                           window-height
+                           window-width)
+        item-width       (if (and landscape? platform/ios?) screen-height screen-width)]
     [reanimated/view
      {:style (reanimated/apply-animations-to-style {:background-color (:background-color animations)}
                                                    {:height screen-height})}
      (when-not @transparent?
-       [:f> top-view/top-view images insets scroll-index animations derived landscape?
+       [:f> top-view/top-view messages insets scroll-index animations derived landscape?
         screen-width])
      [gesture/gesture-detector
       {:gesture (utils/drag-gesture animations (and landscape? platform/ios?) set-full-height?)}
@@ -94,7 +92,7 @@
          :scroll-event-throttle             8
          :style                             {:width (+ screen-width constants/separator-width)}
          :data                              @data
-         :render-fn                         image-view
+         :render-fn                         image
          :render-data                       {:opacity-value     (:opacity animations)
                                              :overlay-opacity   (:overlay-opacity animations)
                                              :border-value      (:border animations)
@@ -120,47 +118,26 @@
      ;; NOTE: not un-mounting bottom-view based on `transparent?` (like we do with the top-view
      ;;       above), since we need to save the state of the text-sheet position. Instead, we use
      ;;       the `:display` style property to hide the bottom-sheet.
-     (when (and (not landscape?) (or bottom-text-component (> (count images) 1)))
-       [:f> bottom-view/bottom-view
-        {:images                images
-         :index                 index
-         :scroll-index          scroll-index
-         :insets                insets
-         :animations            animations
-         :derived               derived
-         :item-width            item-width
-         :props                 props
-         :state                 state
-         :transparent?          transparent?
-         :bottom-text-component bottom-text-component}])]))
+     (when (not landscape?)
+       [:f> bottom-view/bottom-view messages index scroll-index insets animations derived
+        item-width props state transparent?])]))
 
 (defn- f-lightbox
   []
-  (let [{:keys [images index bottom-text-component]} (rf/sub [:get-screen-params])
-        props
-        (utils/init-props)
-        state
-        (utils/init-state images index)
-        handle-items-changed
-        (fn [e]
-          (on-viewable-items-changed e props state))]
+  (let [{:keys [messages index]} (rf/sub [:get-screen-params])
+        props                    (utils/init-props)
+        state                    (utils/init-state messages index)
+        handle-items-changed     (fn [e]
+                                   (on-viewable-items-changed e props state))]
     (fn []
-      (let [animations (utils/init-animations (count images) index)
+      (let [animations (utils/init-animations (count messages) index)
             derived    (utils/init-derived-animations animations)]
         (anim/animate (:background-color animations) colors/neutral-100)
-        (reset! (:data state) images)
+        (reset! (:data state) messages)
         (when platform/ios? ; issue: https://github.com/wix/react-native-navigation/issues/7726
           (utils/orientation-change props state animations))
         (utils/effect props animations index)
-        [:f> lightbox-content
-         {:props                 props
-          :state                 state
-          :animations            animations
-          :derived               derived
-          :images                images
-          :index                 index
-          :handle-items-changed  handle-items-changed
-          :bottom-text-component bottom-text-component}]))))
+        [:f> lightbox-content props state animations derived messages index handle-items-changed]))))
 
 (defn lightbox
   []

src/status_im/contexts/chat/messenger/lightbox/zoomable_image/constants.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.zoomable-image.constants)
+(ns status-im.contexts.chat.messenger.lightbox.zoomable-image.constants)
 
 (def ^:const min-scale 1)
 

src/status_im/contexts/chat/messenger/lightbox/zoomable_image/style.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.zoomable-image.style
+(ns status-im.contexts.chat.messenger.lightbox.zoomable-image.style
   (:require
     [react-native.platform :as platform]
     [react-native.reanimated :as reanimated]))

src/status_im/contexts/chat/messenger/lightbox/zoomable_image/utils.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.zoomable-image.utils
+(ns status-im.contexts.chat.messenger.lightbox.zoomable-image.utils
   (:require
     [clojure.string :as string]
     [react-native.core :as rn]
@@ -6,8 +6,8 @@
     [react-native.orientation :as orientation]
     [react-native.platform :as platform]
     [reagent.core :as reagent]
-    [status-im.common.lightbox.animations :as anim]
-    [status-im.common.lightbox.zoomable-image.constants :as constants]
+    [status-im.contexts.chat.messenger.lightbox.animations :as anim]
+    [status-im.contexts.chat.messenger.lightbox.zoomable-image.constants :as constants]
     [utils.re-frame :as rf]))
 
 ;;; Helpers
@@ -97,7 +97,7 @@
         (rescale constants/min-scale true)
         (js/setTimeout #(rf/dispatch [:navigate-back]) 70))
       (rf/dispatch [:navigate-back]))
-    (js/setTimeout #(rf/dispatch [:lightbox/exit-lightbox-signal nil]) 500)))
+    (js/setTimeout #(rf/dispatch [:chat.ui/exit-lightbox-signal nil]) 500)))
 
 (defn handle-zoom-out-signal
   "Zooms out when pressing on another photo from the small bottom list"

src/status_im/contexts/chat/messenger/lightbox/zoomable_image/view.cljs

@@ -1,4 +1,4 @@
-(ns status-im.common.lightbox.zoomable-image.view
+(ns status-im.contexts.chat.messenger.lightbox.zoomable-image.view
   (:require
     [oops.core :refer [oget]]
     [react-native.core :as rn]
@@ -7,10 +7,10 @@
     [react-native.platform :as platform]
     [react-native.reanimated :as reanimated]
     [reagent.core :as r]
-    [status-im.common.lightbox.animations :as anim]
-    [status-im.common.lightbox.zoomable-image.constants :as c]
-    [status-im.common.lightbox.zoomable-image.style :as style]
-    [status-im.common.lightbox.zoomable-image.utils :as utils]
+    [status-im.contexts.chat.messenger.lightbox.animations :as anim]
+    [status-im.contexts.chat.messenger.lightbox.zoomable-image.constants :as c]
+    [status-im.contexts.chat.messenger.lightbox.zoomable-image.style :as style]
+    [status-im.contexts.chat.messenger.lightbox.zoomable-image.utils :as utils]
     [utils.re-frame :as rf]
     [utils.url :as url]))
 
@@ -206,7 +206,7 @@
              (anim/animate-decay pan-y-start velocity [lower-bound upper-bound]))))))))
 
 (defn- f-zoomable-image
-  [dimensions animations state rescale curr-orientation image focused? index render-data
+  [dimensions animations state rescale curr-orientation content focused? index render-data
    image-dimensions-nil?]
   (let [{:keys [transparent? set-full-height?]} render-data
         portrait? (= curr-orientation orientation/portrait)
@@ -229,7 +229,7 @@
                                (= curr-orientation orientation/portrait))}
       [reanimated/fast-image
        (merge
-        {:source    {:uri (url/replace-port image (rf/sub [:mediaserver/port]))}
+        {:source    {:uri (url/replace-port (:image content) (rf/sub [:mediaserver/port]))}
          :native-ID (when focused? :shared-element)
          :style     (style/image dimensions animations render-data index)}
         (when image-dimensions-nil?
@@ -238,12 +238,12 @@
 (defn zoomable-image
   []
   (let [state (utils/init-state)]
-    (fn [{:keys [image-width image-height image id]} index render-data]
-      (let [animation-shared-element-id                 (rf/sub [:animation-shared-element-id])
+    (fn [{:keys [image-width image-height content message-id]} index render-data]
+      (let [shared-element-id                           (rf/sub [:shared-element-id])
             exit-lightbox-signal                        (rf/sub [:lightbox/exit-signal])
             zoom-out-signal                             (rf/sub [:lightbox/zoom-out-signal])
             {:keys [set-full-height? curr-orientation]} render-data
-            focused?                                    (= animation-shared-element-id id)
+            focused?                                    (= shared-element-id message-id)
             ;; TODO - remove `image-dimensions` check, once
             ;; https://github.com/status-im/status-desktop/issues/10944 is fixed
             image-dimensions-nil?                       (not (and image-width image-height))
@@ -269,5 +269,5 @@
                                              rescale
                                              set-full-height?))
         (utils/handle-zoom-out-signal zoom-out-signal index (anim/get-val (:scale animations)) rescale)
-        [:f> f-zoomable-image dimensions animations state rescale curr-orientation image focused?
+        [:f> f-zoomable-image dimensions animations state rescale curr-orientation content focused?
          index render-data image-dimensions-nil?]))))

src/status_im/contexts/chat/messenger/messages/content/album/view.cljs

@@ -7,8 +7,6 @@
     [status-im.constants :as constants]
     [status-im.contexts.chat.messenger.messages.content.album.style :as style]
     [status-im.contexts.chat.messenger.messages.content.image.view :as image]
-    [status-im.contexts.chat.messenger.messages.content.lightbox.utils :as lightbox-utils]
-    [status-im.contexts.chat.messenger.messages.content.lightbox.view :as lightbox]
     [status-im.contexts.chat.messenger.messages.content.text.view :as text]
     [utils.re-frame :as rf]
     [utils.url :as url]))
@@ -23,19 +21,17 @@
 
 (defn album-message
   [{:keys [albumize?] :as message} context on-long-press message-container-data]
-  (let [animation-shared-element-id (rf/sub [:animation-shared-element-id])
-        media-server-port           (rf/sub [:mediaserver/port])
-        album-messages              (:album message)
-        first-image                 (first album-messages)
-        album-style                 (if (> (:image-width first-image) (:image-height first-image))
-                                      :landscape
-                                      :portrait)
-        images-count                (count album-messages)
+  (let [shared-element-id (rf/sub [:shared-element-id])
+        media-server-port (rf/sub [:mediaserver/port])
+        first-image       (first (:album message))
+        album-style       (if (> (:image-width first-image) (:image-height first-image))
+                            :landscape
+                            :portrait)
+        images-count      (count (:album message))
         ;; album images are always square, except when we have 3 images, then they must be
         ;; rectangular
         ;; (portrait or landscape)
-        portrait?                   (and (= images-count rectangular-style-count)
-                                         (= album-style :portrait))]
+        portrait?         (and (= images-count rectangular-style-count) (= album-style :portrait))]
     (if (and albumize? (> images-count 1))
       [:<>
        [rn/view {:style {:margin-bottom 4}} [text/text-content first-image]]
@@ -56,21 +52,14 @@
               {:key            (:message-id item)
                :active-opacity 1
                :on-long-press  #(on-long-press message context)
-               :on-press       #(rf/dispatch
-                                 [:lightbox/navigate-to-lightbox
-                                  (:message-id item)
-                                  {:index index
-                                   :images (into []
-                                                 (map
-                                                  lightbox-utils/convert-message-to-lightbox-image
-                                                  album-messages))
-                                   :bottom-text-component
-                                   [lightbox/bottom-text-for-lightbox
-                                    first-image]}])}
+               :on-press       #(rf/dispatch [:chat.ui/navigate-to-lightbox
+                                              (:message-id item)
+                                              {:messages (:album message)
+                                               :index    index}])}
               [fast-image/fast-image
                {:style     (style/image dimensions index portrait? images-count)
                 :source    {:uri (url/replace-port (:image (:content item)) media-server-port)}
-                :native-ID (when (and (= animation-shared-element-id (:message-id item))
+                :native-ID (when (and (= shared-element-id (:message-id item))
                                       (< index constants/max-album-photos))
                              :shared-element)}]
               (when (and (> images-count constants/max-album-photos)
@@ -82,11 +71,11 @@
                    :size   :heading-2
                    :style  {:color colors/white}}
                   (str "+" (- images-count (dec constants/max-album-photos)))]])]))
-         album-messages)]]
+         (:album message))]]
       [:<>
        (map-indexed
         (fn [index item]
           [:<> {:key (:message-id item)}
            [image/image-message index item {:on-long-press #(on-long-press message context)}
             message-container-data]])
-        album-messages)])))
+        (:album message))])))

src/status_im/contexts/chat/messenger/messages/content/image/view.cljs

@@ -4,8 +4,6 @@
     [react-native.fast-image :as fast-image]
     [react-native.safe-area :as safe-area]
     [status-im.constants :as constants]
-    [status-im.contexts.chat.messenger.messages.content.lightbox.utils :as lightbox-utils]
-    [status-im.contexts.chat.messenger.messages.content.lightbox.view :as lightbox]
     [status-im.contexts.chat.messenger.messages.content.text.view :as text]
     [utils.re-frame :as rf]
     [utils.url :as url]))
@@ -41,7 +39,7 @@
                                                             image-height
                                                             max-container-width
                                                             max-container-height)
-        animation-shared-element-id   (rf/sub [:animation-shared-element-id])
+        shared-element-id             (rf/sub [:shared-element-id])
         image-local-url               (url/replace-port (:image content) (rf/sub [:mediaserver/port]))]
     [:<>
      (when (= index 0)
@@ -50,16 +48,13 @@
       {:active-opacity 1
        :style          {:margin-top 4}
        :on-long-press  on-long-press
-       :on-press       #(rf/dispatch [:lightbox/navigate-to-lightbox
+       :on-press       #(rf/dispatch [:chat.ui/navigate-to-lightbox
                                       message-id
-                                      {:images [(lightbox-utils/convert-message-to-lightbox-image
-                                                 message)]
-                                       :index 0
-                                       :insets insets
-                                       :bottom-text-component
-                                       [lightbox/bottom-text-for-lightbox message]}])}
+                                      {:messages [message]
+                                       :index    0
+                                       :insets   insets}])}
       [fast-image/fast-image
        {:source              {:uri image-local-url}
         :style               (merge dimensions {:border-radius 12})
-        :native-ID           (when (= animation-shared-element-id message-id) :shared-element)
+        :native-ID           (when (= shared-element-id message-id) :shared-element)
         :accessibility-label :image-message}]]]))

src/status_im/contexts/chat/messenger/messages/content/lightbox/style.cljs

@@ -1,10 +0,0 @@
-(ns status-im.contexts.chat.messenger.messages.content.lightbox.style
-  (:require
-    [quo.foundations.colors :as colors]))
-
-(defn bottom-text
-  [expandable-text?]
-  {:color             colors/white
-   :margin-horizontal 20
-   :align-items       (when-not expandable-text? :center)
-   :flex-grow         1})

src/status_im/contexts/chat/messenger/messages/content/lightbox/utils.cljs

@@ -1,14 +0,0 @@
-(ns status-im.contexts.chat.messenger.messages.content.lightbox.utils
-  (:require
-    [utils.datetime :as datetime]
-    [utils.re-frame :as rf]))
-
-(defn convert-message-to-lightbox-image
-  [{:keys [timestamp image-width image-height message-id from content]}]
-  (let [[primary-name _] (rf/sub [:contacts/contact-two-names-by-identity from])]
-    {:image        (:image content)
-     :image-width  image-width
-     :image-height image-height
-     :id           message-id
-     :header       primary-name
-     :description  (when timestamp (datetime/to-short-str timestamp))}))

src/status_im/contexts/chat/messenger/messages/content/lightbox/view.cljs

@@ -1,18 +0,0 @@
-(ns status-im.contexts.chat.messenger.messages.content.lightbox.view
-  (:require
-    [oops.core :as oops]
-    [reagent.core :as reagent]
-    [status-im.common.lightbox.constants :as constants]
-    [status-im.contexts.chat.messenger.messages.content.lightbox.style :as style]
-    [status-im.contexts.chat.messenger.messages.content.text.view :as message-view]))
-
-(defn bottom-text-for-lightbox
-  [_]
-  (let [text-height (reagent/atom 0)]
-    (fn [{:keys [content chat-id] :as _message}]
-      (let [expandable-text? (> @text-height (* constants/line-height 2))]
-        [message-view/render-parsed-text
-         {:content        content
-          :chat-id        chat-id
-          :style-override (style/bottom-text expandable-text?)
-          :on-layout      #(reset! text-height (oops/oget % "nativeEvent.layout.height"))}]))))

src/status_im/contexts/chat/messenger/messages/content/reactions/view.cljs

@@ -52,7 +52,7 @@
          (get constants/reactions (:emoji-id reaction))))
 
 (defn- view-internal
-  [{:keys [message-id chat-id pinned-by preview? theme]} user-message-content]
+  [{:keys [message-id chat-id pinned-by theme]} user-message-content]
   (let [reactions (rf/sub [:chats/message-reactions message-id chat-id])]
     [:<>
      (when (seq reactions)
@@ -60,7 +60,7 @@
         {:container-style {:margin-left 44
                            :margin-top  8}
          :reactions       (map add-emoji-key reactions)
-         :add-reaction?   (not preview?)
+         :add-reaction?   true
          :use-case        (when pinned-by :pinned)
          :on-press        #(on-press (assoc % :message-id message-id))
          :on-long-press   #(on-long-press (assoc %

src/status_im/contexts/chat/messenger/messages/content/style.cljs

@@ -2,8 +2,6 @@
   (:require
     [quo.foundations.colors :as colors]))
 
-(def ^:private message-padding-scaling-ratio 4.5)
-
 (defn message-container
   ([]
    (message-container false nil nil false))
@@ -18,16 +16,10 @@
      (assoc :margin-top 4))))
 
 (defn user-message-content
-  [{:keys [outgoing outgoing-status six-reactions? window-scale small-screen?]}]
+  [{:keys [outgoing outgoing-status]}]
   {:border-radius      16
    :padding-horizontal 8
-   :padding-top        4
-   :padding-bottom     (if (or small-screen?
-                               (and
-                                (> 3 window-scale)
-                                six-reactions?))
-                         (* message-padding-scaling-ratio window-scale)
-                         4)
+   :padding-vertical   4
    :opacity            (if (and outgoing (= outgoing-status :sending))
                          0.5
                          1)})

src/status_im/contexts/chat/messenger/messages/content/view.cljs

@@ -119,38 +119,31 @@
   []
   (let [show-delivery-state? (reagent/atom false)]
     (fn [{:keys [message-data context keyboard-shown? show-reactions? in-reaction-and-action-menu?
-                 show-user-info? preview? theme]}]
+                 show-user-info? theme]}]
       (let [{:keys [content-type quoted-message content
-                    outgoing outgoing-status pinned-by
-                    message-id chat-id]} message-data
-            first-image                  (first (:album message-data))
-            outgoing-status              (if (= content-type
-                                                constants/content-type-album)
-                                           (:outgoing-status first-image)
-                                           outgoing-status)
-            outgoing                     (if (= content-type
-                                                constants/content-type-album)
-                                           (:outgoing first-image)
-                                           outgoing)
-            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])
-            {window-width :width
-             window-scale :scale}        (rn/get-window)
-            message-container-data       {:window-width           window-width
-                                          :padding-right          20
-                                          :padding-left           20
-                                          :avatar-container-width 32
-                                          :message-margin-left    8}
-            reactions                    (rf/sub [:chats/message-reactions message-id
-                                                  chat-id])
-            six-reactions?               (-> reactions
-                                             count
-                                             (= 6))]
+                    outgoing outgoing-status pinned-by]} message-data
+            first-image                                  (first (:album message-data))
+            outgoing-status                              (if (= content-type
+                                                                constants/content-type-album)
+                                                           (:outgoing-status first-image)
+                                                           outgoing-status)
+            outgoing                                     (if (= content-type
+                                                                constants/content-type-album)
+                                                           (:outgoing first-image)
+                                                           outgoing)
+            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])
+            {window-width :width}                        (rn/get-window)
+            message-container-data                       {:window-width           window-width
+                                                          :padding-right          20
+                                                          :padding-left           20
+                                                          :avatar-container-width 32
+                                                          :message-margin-left    8}]
         [rn/touchable-highlight
          {:accessibility-label (if (and outgoing (= outgoing-status :sending))
                                  :message-sending
@@ -159,10 +152,7 @@
           :style               (style/user-message-content
                                 {:first-in-group? (:first-in-group? message-data)
                                  :outgoing        outgoing
-                                 :outgoing-status outgoing-status
-                                 :small-screen?   rn/small-screen?
-                                 :window-scale    window-scale
-                                 :six-reactions?  six-reactions?})
+                                 :outgoing-status outgoing-status})
           :on-press            (fn []
                                  (if (and platform/ios? keyboard-shown?)
                                    (do
@@ -222,7 +212,7 @@
              (when @show-delivery-state?
                [status/status outgoing-status])])]
           (when show-reactions?
-            [reactions/message-reactions-row (assoc message-data :preview? preview?)
+            [reactions/message-reactions-row message-data
              [rn/view {:pointer-events :none}
               [user-message-content-internal
                {:theme           theme
@@ -236,24 +226,22 @@
 (defn on-long-press
   [{:keys [deleted? deleted-for-me?] :as message-data} context keyboard-shown?]
   (rf/dispatch [:dismiss-keyboard])
-  (rf/dispatch
-   [:show-bottom-sheet
-    {:content (drawers/reactions-and-actions message-data context)
-     :border-radius 16
-     :selected-item
-     (if (or deleted? deleted-for-me?)
-       (fn [] [content.deleted/deleted-message message-data])
-       (fn []
-         [rn/view
-          {:pointer-events :none
-           :padding-top    4}
-          [user-message-content
-           {:message-data    message-data
-            :context         context
-            :keyboard-shown? keyboard-shown?
-            :show-reactions? true
-            :show-user-info? true
-            :preview?        true}]]))}]))
+  (rf/dispatch [:show-bottom-sheet
+                {:content (drawers/reactions-and-actions message-data context)
+                 :border-radius 16
+                 :selected-item
+                 (if (or deleted? deleted-for-me?)
+                   (fn [] [content.deleted/deleted-message message-data])
+                   (fn []
+                     [rn/view
+                      {:pointer-events :none
+                       :padding-top    4}
+                      [user-message-content
+                       {:message-data    message-data
+                        :context         context
+                        :keyboard-shown? keyboard-shown?
+                        :show-reactions? true
+                        :show-user-info? true}]]))}]))
 
 (defn system-message?
   [content-type]

src/status_im/contexts/chat/messenger/messages/drawers/style.cljs

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

src/status_im/contexts/chat/messenger/messages/drawers/view.cljs

@@ -34,10 +34,10 @@
            {:id                  reaction-type-int
             :accessibility-label (keyword (str "authors-for-reaction-" reaction-type-int))
             :label               [rn/view {:style style/tab}
-                                  [rn/text
-                                   {:style style/tab-icon}
-                                   (reactions.resource/system-emojis
-                                    (get constants/reactions reaction-type-int))]
+                                  [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_im/contexts/chat/messenger/messages/link_preview/events.cljs

@@ -1,6 +1,8 @@
 (ns status-im.contexts.chat.messenger.messages.link-preview.events
   (:require
     [camel-snake-kebab.core :as csk]
+    [legacy.status-im.mailserver.core :as mailserver]
+    [schema.core :as schema]
     [status-im.contexts.profile.settings.events :as profile.settings.events]
     [taoensso.timbre :as log]
     [utils.collection]
@@ -40,6 +42,96 @@
    (boolean enabled?)
    {}))
 
+(defn community-resolved
+  [{:keys [db]} [community-id community]]
+  (when community
+    {:db (update db :communities/resolve-community-info dissoc community-id)
+     :fx [[:dispatch [:communities/handle-community community]]
+          [:dispatch
+           [:chat.ui/cache-link-preview-data (community-link community-id) community]]]}))
+
+(rf/reg-event-fx :chat.ui/community-resolved community-resolved)
+
+(defn community-failed-to-resolve
+  [{:keys [db]} [community-id]]
+  {:db (update db :communities/resolve-community-info dissoc community-id)})
+
+(rf/reg-event-fx :chat.ui/community-failed-to-resolve community-failed-to-resolve)
+
+(defn fetch-community
+  [{:keys [db]} [community-id]]
+  (when community-id
+    {:db            (assoc-in db [:communities/resolve-community-info community-id] true)
+     :json-rpc/call [{:method     "wakuext_fetchCommunity"
+                      :params     [{:CommunityKey    community-id
+                                    :TryDatabase     true
+                                    :WaitForResponse true}]
+                      :on-success (fn [community]
+                                    (rf/dispatch [:chat.ui/community-resolved community-id community]))
+                      :on-error   (fn [err]
+                                    (rf/dispatch [:chat.ui/community-failed-to-resolve community-id])
+                                    (log/error {:message
+                                                "Failed to request community info from mailserver"
+                                                :error err}))}]}))
+
+(schema/=> fetch-community
+  [:=>
+   [:catn
+    [:cofx :schema.re-frame/cofx]
+    [:args
+     [:schema [:catn [:community-id [:? :string]]]]]]
+   [:maybe
+    [:map
+     [:db map?]
+     [:json-rpc/call :schema.common/rpc-call]]]])
+
+(rf/reg-event-fx :chat.ui/fetch-community fetch-community)
+
+(defn spectate-community-success
+  [{:keys [db]} [{:keys [communities]}]]
+  (when-let [community (first communities)]
+    {:db (-> db
+             (assoc-in [:communities (:id community) :spectated] true)
+             (assoc-in [:communities (:id community) :spectating] false))
+     :fx [[:dispatch [:communities/handle-community community]]
+          [:dispatch [::mailserver/request-messages]]]}))
+
+(rf/reg-event-fx :chat.ui/spectate-community-success spectate-community-success)
+
+(defn spectate-community-failed
+  [{:keys [db]} [community-id]]
+  {:db (assoc-in db [:communities community-id :spectating] false)})
+
+(rf/reg-event-fx :chat.ui/spectate-community-failed spectate-community-failed)
+
+(defn spectate-community
+  [{:keys [db]} [community-id]]
+  (let [{:keys [spectated spectating joined]} (get-in db [:communities community-id])]
+    (when (and (not joined) (not spectated) (not spectating))
+      {:db            (assoc-in db [:communities community-id :spectating] true)
+       :json-rpc/call [{:method     "wakuext_spectateCommunity"
+                        :params     [community-id]
+                        :on-success [:chat.ui/spectate-community-success]
+                        :on-error   (fn [err]
+                                      (log/error {:message
+                                                  "Failed to spectate community"
+                                                  :error err})
+                                      (rf/dispatch [:chat.ui/spectate-community-failed
+                                                    community-id]))}]})))
+
+(schema/=> spectate-community
+  [:=>
+   [:catn
+    [:cofx :schema.re-frame/cofx]
+    [:args
+     [:schema [:catn [:community-id [:? :string]]]]]]
+   [:maybe
+    [:map
+     [:db map?]
+     [:json-rpc/call :schema.common/rpc-call]]]])
+
+(rf/reg-event-fx :chat.ui/spectate-community spectate-community)
+
 (rf/defn save-link-preview-whitelist
   {:events [:chat.ui/link-preview-whitelist-received]}
   [{:keys [db]} whitelist]

src/status_im/contexts/chat/messenger/messages/link_preview/events_test.cljs

@@ -0,0 +1,139 @@
+(ns status-im.contexts.chat.messenger.messages.link-preview.events-test
+  (:require [cljs.test :as t]
+            [legacy.status-im.mailserver.core :as mailserver]
+            matcher-combinators.test
+            [status-im.contexts.chat.messenger.messages.link-preview.events :as sut]))
+
+(t/deftest fetch-community
+  (t/testing "with community id"
+    (t/testing "update resolving indicator in db"
+      (t/is (match?
+             {:db {:communities/resolve-community-info {"community-id" true}}}
+             (sut/fetch-community {} ["community-id"]))))
+    (t/testing "call the fetch community rpc method with correct community id"
+      (t/is (match?
+             {:json-rpc/call [{:method "wakuext_fetchCommunity"
+                               :params [{:CommunityKey    "community-id"
+                                         :TryDatabase     true
+                                         :WaitForResponse true}]}]}
+             (sut/fetch-community {} ["community-id"])))))
+  (t/testing "with no community id"
+    (t/testing "do nothing"
+      (t/is (match?
+             nil
+             (sut/fetch-community {} []))))))
+
+(t/deftest community-failed-to-resolve
+  (t/testing "given a community id"
+    (t/testing "remove community id from resolving indicator in db"
+      (t/is (match?
+             nil
+             (get-in (sut/community-failed-to-resolve {:db {:communities/resolve-community-info
+                                                            {"community-id" true}}}
+                                                      ["community-id"])
+                     [:db :communities/resolve-community-info "community-id"]))))))
+
+(t/deftest community-resolved
+  (with-redefs [sut/community-link (fn [id] (str "community-link+" id))]
+    (t/testing "given a community"
+      (let [cofx {:db {:communities/resolve-community-info {"community-id" true}}}
+            arg  ["community-id" {:id "community-id"}]]
+        (t/testing "remove community id from resolving indicator in db"
+          (t/is (match?
+                 nil
+                 (get-in (sut/community-resolved cofx arg)
+                         [:db :communities/resolve-community-info "community-id"]))))
+        (t/testing "dispatch fxs"
+          (t/is (match?
+                 {:fx [[:dispatch [:communities/handle-community {:id "community-id"}]]
+                       [:dispatch
+                        [:chat.ui/cache-link-preview-data "community-link+community-id"
+                         {:id "community-id"}]]]}
+                 (sut/community-resolved cofx arg))))))
+    (t/testing "given a joined community"
+      (let [cofx {:db {:communities/resolve-community-info {"community-id" true}}}
+            arg  ["community-id" {:id "community-id" :joined true}]]
+        (t/testing "dispatch fxs, do not spectate community"
+          (t/is (match?
+                 {:fx [[:dispatch [:communities/handle-community {:id "community-id"}]]
+                       [:dispatch
+                        [:chat.ui/cache-link-preview-data "community-link+community-id"
+                         {:id "community-id"}]]]}
+                 (sut/community-resolved cofx arg))))))
+    (t/testing "given a token-gated community"
+      (let [cofx {:db {:communities/resolve-community-info {"community-id" true}}}
+            arg  ["community-id" {:id "community-id" :tokenPermissions [1]}]]
+        (t/testing "dispatch fxs, do not spectate community"
+          (t/is (match?
+                 {:fx [[:dispatch [:communities/handle-community {:id "community-id"}]]
+                       [:dispatch
+                        [:chat.ui/cache-link-preview-data "community-link+community-id"
+                         {:id "community-id"}]]]}
+                 (sut/community-resolved cofx arg))))))
+    (t/testing "given nil community"
+      (t/testing "do nothing"
+        (t/is (match?
+               nil
+               (sut/community-resolved {} ["community-id" nil])))))))
+
+(t/deftest spectate-community
+  (t/testing "given a joined community"
+    (t/testing "do nothing"
+      (t/is (match?
+             nil
+             (sut/spectate-community {:db {:communities {"community-id" {:joined true}}}}
+                                     ["community-id"])))))
+  (t/testing "given a spectated community"
+    (t/testing "do nothing"
+      (t/is (match?
+             nil
+             (sut/spectate-community {:db {:communities {"community-id" {:spectated true}}}}
+                                     ["community-id"])))))
+  (t/testing "given a spectating community"
+    (t/testing "do nothing"
+      (t/is (match?
+             nil
+             (sut/spectate-community {:db {:communities {"community-id" {:spectating true}}}}
+                                     ["community-id"])))))
+  (t/testing "given a community"
+    (t/testing "mark community spectating"
+      (t/is (match?
+             {:db {:communities {"community-id" {:spectating true}}}}
+             (sut/spectate-community {:db {:communities {"community-id" {}}}} ["community-id"]))))
+    (t/testing "call spectate community rpc with correct community id"
+      (t/is (match?
+             {:json-rpc/call [{:method "wakuext_spectateCommunity"
+                               :params ["community-id"]}]}
+             (sut/spectate-community {:db {:communities {"community-id" {}}}} ["community-id"]))))))
+
+(t/deftest spectate-community-failed
+  (t/testing "mark community spectating false"
+    (t/is (match?
+           {:db {:communities {"community-id" {:spectating false}}}}
+           (sut/spectate-community-failed {} ["community-id"])))))
+
+(t/deftest spectate-community-success
+  (t/testing "given communities"
+    (t/testing "mark first community spectating false"
+      (t/is (match?
+             {:db {:communities {"community-id" {:spectating false}}}}
+             (sut/spectate-community-success {} [{:communities [{:id "community-id"}]}]))))
+    (t/testing "mark first community spectated true"
+      (t/is (match?
+             {:db {:communities {"community-id" {:spectated true}}}}
+             (sut/spectate-community-success {} [{:communities [{:id "community-id"}]}]))))
+    (t/testing "dispatch fxs for first community"
+      (t/is (match?
+             {:fx [[:dispatch [:communities/handle-community {:id "community-id"}]]
+                   [:dispatch [::mailserver/request-messages]]]}
+             (sut/spectate-community-success {} [{:communities [{:id "community-id"}]}])))))
+  (t/testing "given empty community"
+    (t/testing "do nothing"
+      (t/is (match?
+             nil
+             (sut/spectate-community-success {} [{:communities []}])))))
+  (t/testing "given nil community"
+    (t/testing "do nothing"
+      (t/is (match?
+             nil
+             (sut/spectate-community-success {} []))))))

src/status_im/contexts/chat/messenger/messages/link_preview/view.cljs

@@ -81,7 +81,7 @@
       (fn []
         (when-not cached-preview-data
           (let [community-id (community-id-from-link community-link)]
-            (rf/dispatch [:communities/fetch-community community-id]))))
+            (rf/dispatch [:chat.ui/fetch-community community-id]))))
       :reagent-render
       (fn []
         (when cached-preview-data

src/status_im/contexts/chat/messenger/messages/list/view.cljs

@@ -159,7 +159,7 @@
                                                     unmute-chat-label
                                                     mute-chat-label))
                  :color               cover-bg-color
-                 :icon                (if muted? :i/activity-center :i/muted)
+                 :icon                (if muted? :i/muted :i/activity-center)
                  :on-press            (fn []
                                         (if muted?
                                           (home.actions/unmute-chat-action chat-id)
@@ -267,7 +267,7 @@
 
 (defn on-layout
   [{:keys [event layout-height distance-atom distance-from-list-top
-           chat-screen-layout-calculations-complete?]}]
+           calculations-complete? messages-list-on-layout-finished?]}]
   (let [layout-height-new (oops/oget event "nativeEvent.layout.height")
         change            (- layout-height-new @layout-height)
         new-distance      (- @distance-atom change)]
@@ -275,8 +275,9 @@
       (reanimated/set-shared-value distance-from-list-top new-distance)
       (reset! distance-atom new-distance)
       (reset! layout-height layout-height-new))
-    (when-not (reanimated/get-shared-value chat-screen-layout-calculations-complete?)
-      (reanimated/set-shared-value chat-screen-layout-calculations-complete? true))))
+    (when-not (reanimated/get-shared-value calculations-complete?)
+      (reanimated/set-shared-value calculations-complete? true))
+    (js/setTimeout #(reset! messages-list-on-layout-finished? true) 1000)))
 
 (defn on-scroll-fn
   [distance-atom layout-height-atom]
@@ -287,7 +288,7 @@
 
 (defn f-messages-list-content
   [{:keys [insets distance-from-list-top content-height layout-height cover-bg-color distance-atom
-           chat-screen-layout-calculations-complete? chat-list-scroll-y]}]
+           calculations-complete? messages-list-on-layout-finished? chat-list-scroll-y]}]
   (let [theme                    (quo.theme/use-theme-value)
         chat                     (rf/sub [:chats/current-chat-chat-view])
         {:keys [keyboard-shown]} (hooks/use-keyboard)
@@ -350,7 +351,8 @@
                                               :layout-height layout-height
                                               :distance-atom distance-atom
                                               :distance-from-list-top distance-from-list-top
-                                              :chat-screen-layout-calculations-complete?
-                                              chat-screen-layout-calculations-complete?})
+                                              :calculations-complete? calculations-complete?
+                                              :messages-list-on-layout-finished?
+                                              messages-list-on-layout-finished?})
         :scroll-enabled                    (not recording?)
         :content-inset-adjustment-behavior :never}]]]))

src/status_im/contexts/chat/messenger/messages/navigation/view.cljs

@@ -18,7 +18,7 @@
     [utils.worklets.chat.messenger.navigation :as worklets]))
 
 (defn f-header-content-container
-  [{:keys [chat distance-from-list-top all-loaded? chat-screen-layout-calculations-complete?]}]
+  [{:keys [chat distance-from-list-top all-loaded? calculations-complete?]}]
   (let [{:keys [chat-id group-chat chat-type chat-name
                 emoji]} chat
         display-name    (cond
@@ -34,7 +34,7 @@
         header-opacity  (worklets/navigation-header-opacity
                          distance-from-list-top
                          all-loaded?
-                         chat-screen-layout-calculations-complete?
+                         calculations-complete?
                          (if platform/ios?
                            messages.constants/content-animation-start-position-ios
                            messages.constants/content-animation-start-position-android))
@@ -104,7 +104,7 @@
        :top-offset     navigation-view-height}]]))
 
 (defn f-view
-  [{:keys [distance-from-list-top chat-screen-layout-calculations-complete?]}]
+  [{:keys [distance-from-list-top calculations-complete?]}]
   (let [{:keys [chat-id chat-type] :as chat} (rf/sub [:chats/current-chat-chat-view])
         all-loaded?                          (reanimated/use-shared-value false)
         all-loaded-sub                       (rf/sub [:chats/all-loaded? chat-id])
@@ -129,10 +129,10 @@
         :on-press            #(rf/dispatch [:navigate-back])}
        (if (= chat-type constants/community-chat-type) :i/arrow-left :i/close)]
       [:f> f-header-content-container
-       {:chat                                      chat
-        :distance-from-list-top                    distance-from-list-top
-        :all-loaded?                               all-loaded?
-        :chat-screen-layout-calculations-complete? chat-screen-layout-calculations-complete?}]
+       {:chat                   chat
+        :distance-from-list-top distance-from-list-top
+        :all-loaded?            all-loaded?
+        :calculations-complete? calculations-complete?}]
       [quo/button
        {:icon-only?          true
         :type                :grey

src/status_im/contexts/chat/messenger/messages/view.cljs

@@ -3,6 +3,7 @@
     [react-native.core :as rn]
     [react-native.reanimated :as reanimated]
     [react-native.safe-area :as safe-area]
+    [reagent.core :as reagent]
     [status-im.contexts.chat.messenger.composer.view :as composer.view]
     [status-im.contexts.chat.messenger.messages.list.style :as style]
     [status-im.contexts.chat.messenger.messages.list.view :as list.view]
@@ -14,47 +15,49 @@
 ;; improvement. Please avoid refactoring these files. Also if you are not already working on bug
 ;; fixes related to the composer, please skip them. And ping me, so I can address them while refactoring
 (defn- f-chat-screen
-  [chat-screen-layout-calculations-complete?]
-  (let [insets                 (safe-area/get-insets)
-        content-height         (atom 0)
-        layout-height          (atom 0)
-        distance-atom          (atom 0)
-        distance-from-list-top (reanimated/use-shared-value 0)
-        chat-list-scroll-y     (reanimated/use-shared-value 0)]
+  [calculations-complete?]
+  (let [insets                            (safe-area/get-insets)
+        content-height                    (atom 0)
+        layout-height                     (atom 0)
+        distance-atom                     (atom 0)
+        messages-list-on-layout-finished? (reagent/atom false)
+        distance-from-list-top            (reanimated/use-shared-value 0)
+        chat-list-scroll-y                (reanimated/use-shared-value 0)]
     [rn/keyboard-avoiding-view
      {:style                    style/keyboard-avoiding-container
       :keyboard-vertical-offset (- (:bottom insets))}
      [:f> messages.navigation/f-view
-      {:distance-from-list-top                    distance-from-list-top
-       :chat-screen-layout-calculations-complete? chat-screen-layout-calculations-complete?}]
+      {:distance-from-list-top distance-from-list-top
+       :calculations-complete? calculations-complete?}]
      [:f> list.view/f-messages-list-content
-      {:insets                                    insets
-       :layout-height                             layout-height
-       :content-height                            content-height
-       :distance-atom                             distance-atom
-       :chat-screen-layout-calculations-complete? chat-screen-layout-calculations-complete?
-       :distance-from-list-top                    distance-from-list-top
-       :chat-list-scroll-y                        chat-list-scroll-y
-       :cover-bg-color                            :turquoise}]
+      {:insets                            insets
+       :layout-height                     layout-height
+       :content-height                    content-height
+       :distance-atom                     distance-atom
+       :calculations-complete?            calculations-complete?
+       :distance-from-list-top            distance-from-list-top
+       :chat-list-scroll-y                chat-list-scroll-y
+       :messages-list-on-layout-finished? messages-list-on-layout-finished?
+       :cover-bg-color                    :turquoise}]
      [composer.view/composer
-      {:insets                                    insets
-       :chat-screen-layout-calculations-complete? chat-screen-layout-calculations-complete?
-       :chat-list-scroll-y                        chat-list-scroll-y}]]))
+      {:insets                            insets
+       :chat-list-scroll-y                chat-list-scroll-y
+       :messages-list-on-layout-finished? messages-list-on-layout-finished?}]]))
 
 (defn lazy-chat-screen
-  [chat-screen-layout-calculations-complete?]
+  [calculations-complete?]
   (let [screen-loaded? (rf/sub [:shell/chat-screen-loaded?])]
     (when-not screen-loaded?
-      (reanimated/set-shared-value chat-screen-layout-calculations-complete? false))
+      (reanimated/set-shared-value calculations-complete? false))
     (when screen-loaded?
-      [:f> f-chat-screen chat-screen-layout-calculations-complete?])))
+      [:f> f-chat-screen calculations-complete?])))
 
 (defn- f-chat
   []
-  (let [chat-screen-layout-calculations-complete? (reanimated/use-shared-value false)]
+  (let [calculations-complete? (reanimated/use-shared-value false)]
     [:<>
-     [lazy-chat-screen chat-screen-layout-calculations-complete?]
-     [:f> placeholder.view/f-view chat-screen-layout-calculations-complete?]]))
+     [lazy-chat-screen calculations-complete?]
+     [:f> placeholder.view/f-view calculations-complete?]]))
 
 (defn chat
   []

src/status_im/contexts/chat/messenger/placeholder/view.cljs

@@ -15,9 +15,9 @@
     :animated?     false}])
 
 (defn f-view
-  [chat-screen-layout-calculations-complete?]
+  [calculations-complete?]
   (let [top     (safe-area/get-top)
-        opacity (worklets/placeholder-opacity chat-screen-layout-calculations-complete?)
-        z-index (worklets/placeholder-z-index chat-screen-layout-calculations-complete?)]
+        opacity (worklets/placeholder-opacity calculations-complete?)
+        z-index (worklets/placeholder-z-index calculations-complete?)]
     [reanimated/view {:style (style/container top opacity z-index)}
      [loading-skeleton]]))

src/status_im/contexts/communities/actions/accounts_selection/view.cljs

@@ -23,8 +23,11 @@
   []
   (let [{id :community-id}          (rf/sub [:get-screen-params])
         {:keys [name color images]} (rf/sub [:communities/community id])
-        airdrop-account             (rf/sub [:communities/airdrop-account id])
-        selected-accounts           (rf/sub [:communities/selected-permission-accounts id])]
+        airdrop-account             (rf/sub [:communities/airdrop-account])
+        selected-accounts           (rf/sub [:communities/selected-permission-accounts])]
+    (rn/use-effect (fn []
+                     (rf/dispatch [:communities/initialize-permission-addresses]))
+                   [])
     [rn/view {:style style/container}
      [quo/page-nav
       {:text-align          :left

src/status_im/contexts/communities/actions/addresses_for_permissions/view.cljs

@@ -8,7 +8,7 @@
             [utils.re-frame :as rf]))
 
 (defn- account-item
-  [item _ _ [selected-addresses community-id]]
+  [item _ _ selected-addresses]
   [quo/account-permissions
    {:account         {:name                (:name item)
                       :address             (:address item)
@@ -17,7 +17,7 @@
     :token-details   []
     :checked?        (contains? selected-addresses (:address item))
     :on-change       #(rf/dispatch [:communities/toggle-selected-permission-address
-                                    (:address item) community-id])
+                                    (:address item)])
     :container-style {:margin-bottom 8}}])
 
 (defn view
@@ -25,7 +25,7 @@
   (let [{id :community-id}          (rf/sub [:get-screen-params])
         {:keys [name color images]} (rf/sub [:communities/community id])
         accounts                    (rf/sub [:wallet/accounts-with-customization-color])
-        selected-addresses          (rf/sub [:communities/selected-permission-addresses id])]
+        selected-addresses          (rf/sub [:communities/selected-permission-addresses])]
     [rn/safe-area-view {:style style/container}
      [quo/drawer-top
       {:type                :context-tag
@@ -38,7 +38,7 @@
 
      [rn/flat-list
       {:render-fn               account-item
-       :render-data             [selected-addresses id]
+       :render-data             selected-addresses
        :content-container-style {:padding 20}
        :key-fn                  :address
        :data                    accounts}]
@@ -60,7 +60,7 @@
        {:type            :grey
         :container-style {:flex 1}
         :on-press        (fn []
-                           (rf/dispatch [:communities/reset-selected-permission-addresses id])
+                           (rf/dispatch [:communities/reset-selected-permission-addresses])
                            (rf/dispatch [:navigate-back]))}
        (i18n/label :t/cancel)]
       [quo/button
@@ -68,6 +68,6 @@
         :customization-color color
         :disabled?           (empty? selected-addresses)
         :on-press            (fn []
-                               (rf/dispatch [:communities/update-previous-permission-addresses id])
+                               (rf/dispatch [:communities/update-previous-permission-addresses])
                                (rf/dispatch [:navigate-back]))}
        (i18n/label :t/confirm-changes)]]]))

src/status_im/contexts/communities/actions/airdrop_addresses/view.cljs

@@ -8,12 +8,12 @@
     [utils.re-frame :as rf]))
 
 (defn- render-item
-  [item _ _ [airdrop-address community-id]]
+  [item _ _ airdrop-address]
   [quo/account-item
    {:account-props item
     :state         (when (= airdrop-address (:address item)) :selected)
     :on-press      (fn []
-                     (rf/dispatch [:communities/set-airdrop-address (:address item) community-id])
+                     (rf/dispatch [:communities/set-airdrop-address (:address item)])
                      (rf/dispatch [:navigate-back]))
     :emoji         (:emoji item)}])
 
@@ -21,8 +21,8 @@
   []
   (let [{id :community-id}          (rf/sub [:get-screen-params])
         {:keys [name images color]} (rf/sub [:communities/community id])
-        selected-accounts           (rf/sub [:communities/selected-permission-accounts id])
-        airdrop-address             (rf/sub [:communities/airdrop-address id])]
+        selected-accounts           (rf/sub [:communities/selected-permission-accounts])
+        airdrop-address             (rf/sub [:communities/airdrop-address])]
     [:<>
      [quo/drawer-top
       {:type                :context-tag
@@ -35,6 +35,6 @@
      [rn/flat-list
       {:data                    selected-accounts
        :render-fn               render-item
-       :render-data             [airdrop-address id]
+       :render-data             airdrop-address
        :content-container-style style/account-list-container
        :key-fn                  :address}]]))

src/status_im/contexts/communities/actions/token_gating/view.cljs

@@ -6,8 +6,9 @@
     [utils.re-frame :as rf]))
 
 (defn token-requirements
-  []
-  (fn [id]
+  [id]
+  (rf/dispatch [:communities/check-permissions-to-join-community id])
+  (fn []
     (let [{:keys [can-request-access?
                   number-of-hold-tokens tokens]} (rf/sub [:community/token-gated-overview id])]
       [rn/view {:style {:padding-horizontal 12}}

src/status_im/contexts/communities/discover/view.cljs

@@ -20,11 +20,11 @@
       [quo/community-card-view-item
        {:community (assoc item :cover cover)
         :width     width
-        :on-press  #(rf/dispatch [:communities/navigate-to-community-overview (:id item)])}]
-      [quo/community-list
+        :on-press  #(rf/dispatch [:navigate-to :community-overview (:id item)])}]
+      [quo/community-list-item
        {:on-press      (fn []
                          (rf/dispatch [:dismiss-keyboard])
-                         (rf/dispatch [:communities/navigate-to-community-overview (:id item)]))
+                         (rf/dispatch [:navigate-to :community-overview (:id item)]))
         :on-long-press #(rf/dispatch
                          [:show-bottom-sheet
                           {:content (fn []
@@ -142,13 +142,12 @@
            (if (= view-type :card-view)
              [quo/community-card-view-item
               {:community (assoc community :cover cover)
-               :on-press  #(rf/dispatch [:communities/navigate-to-community-overview (:id community)])}]
+               :on-press  #(rf/dispatch [:navigate-to :community-overview (:id community)])}]
 
-             [quo/community-list
+             [quo/community-list-item
               {:on-press      (fn []
                                 (rf/dispatch [:dismiss-keyboard])
-                                (rf/dispatch [:communities/navigate-to-community-overview
-                                              (:id community)]))
+                                (rf/dispatch [:navigate-to :community-overview (:id community)]))
                :on-long-press #(js/alert "TODO: to be implemented")}
               community])]))
       (if communities communities communities-ids))

src/status_im/contexts/communities/events.cljs

@@ -1,17 +1,12 @@
 (ns status-im.contexts.communities.events
   (:require [clojure.set :as set]
-            [clojure.string :as string]
             [clojure.walk :as walk]
             [legacy.status-im.data-store.chats :as data-store.chats]
-            [legacy.status-im.mailserver.core :as mailserver]
             [react-native.platform :as platform]
             [react-native.share :as share]
-            [schema.core :as schema]
             [status-im.constants :as constants]
-            [status-im.contexts.chat.messenger.messages.link-preview.events :as link-preview.events]
             status-im.contexts.communities.actions.community-options.events
             status-im.contexts.communities.actions.leave.events
-            [status-im.navigation.events :as navigation]
             [taoensso.timbre :as log]
             [utils.i18n :as i18n]
             [utils.re-frame :as rf]))
@@ -76,20 +71,14 @@
    (when community-js
      (let [{:keys [token-permissions
                    token-permissions-check joined id]
-            :as   community} (<-rpc community-js)
-           has-channel-perm? (fn [id-perm-tuple]
-                               (let [{:keys [type]} (second id-perm-tuple)]
-                                 (or (= type constants/community-token-permission-can-view-channel)
-                                     (=
-                                      type
-                                      constants/community-token-permission-can-view-and-post-channel))))]
+            :as   community}      (<-rpc community-js)
+           has-token-permissions? (not (seq token-permissions))]
        {:db (assoc-in db [:communities id] community)
-        :fx [[:dispatch [:communities/initialize-permission-addresses id]]
-             (when (not joined)
+        :fx [(when (and has-token-permissions? (not joined))
                [:dispatch [:chat.ui/spectate-community id]])
-             (when (nil? token-permissions-check)
+             (when (and has-token-permissions? (nil? token-permissions-check))
                [:dispatch [:communities/check-permissions-to-join-community id]])
-             (when (some has-channel-perm? token-permissions)
+             (when (and has-token-permissions? (not (get-in db [:community-channels-permissions id])))
                [:dispatch [:communities/check-all-community-channels-permissions id]])]}))))
 
 (rf/defn handle-removed-chats
@@ -200,62 +189,54 @@
                      :on-error   #(log/error "failed to fetch collapsed community categories" %)}]}))
 
 (defn initialize-permission-addresses
-  [{:keys [db]} [community-id]]
-  (when community-id
-    (let [accounts        (get-in db [:wallet :accounts])
-          sorted-accounts (sort-by :position (vals accounts))
-          addresses       (set (map :address sorted-accounts))]
-      {:db (update-in db
-                      [:communities community-id]
-                      assoc
-                      :previous-permission-addresses addresses
-                      :selected-permission-addresses addresses
-                      :airdrop-address               (:address (first sorted-accounts)))})))
+  [{:keys [db]}]
+  (let [accounts        (get-in db [:wallet :accounts])
+        sorted-accounts (sort-by :position (vals accounts))
+        addresses       (set (map :address sorted-accounts))]
+    {:db (assoc db
+                :communities/previous-permission-addresses addresses
+                :communities/selected-permission-addresses addresses
+                :communities/airdrop-address               (:address (first sorted-accounts)))}))
 
 (rf/reg-event-fx :communities/initialize-permission-addresses
  initialize-permission-addresses)
 
 (defn update-previous-permission-addresses
-  [{:keys [db]} [community-id]]
-  (when community-id
-    (let [accounts                      (get-in db [:wallet :accounts])
-          sorted-accounts               (sort-by :position (vals accounts))
-          selected-permission-addresses (get-in db
-                                                [:communities community-id
-                                                 :selected-permission-addresses])
-          selected-accounts             (filter #(contains? selected-permission-addresses (:address %))
-                                                sorted-accounts)
-          current-airdrop-address       (get-in db [:communities community-id :airdrop-address])]
-      {:db (update-in db
-                      [:communities community-id]
-                      assoc
-                      :previous-permission-addresses selected-permission-addresses
-                      :airdrop-address               (if (contains? selected-permission-addresses
-                                                                    current-airdrop-address)
-                                                       current-airdrop-address
-                                                       (:address (first selected-accounts))))})))
+  [{:keys [db]}]
+  (let [accounts                      (get-in db [:wallet :accounts])
+        sorted-accounts               (sort-by :position (vals accounts))
+        selected-permission-addresses (get-in db [:communities/selected-permission-addresses])
+        selected-accounts             (filter #(contains? selected-permission-addresses
+                                                          (:address %))
+                                              sorted-accounts)
+        current-airdrop-address       (get-in db [:communities/airdrop-address])]
+    {:db (assoc db
+                :communities/previous-permission-addresses selected-permission-addresses
+                :communities/airdrop-address               (if (contains? selected-permission-addresses
+                                                                          current-airdrop-address)
+                                                             current-airdrop-address
+                                                             (:address (first selected-accounts))))}))
 
 (rf/reg-event-fx :communities/update-previous-permission-addresses
  update-previous-permission-addresses)
 
 (defn toggle-selected-permission-address
-  [{:keys [db]} [address community-id]]
-  {:db (update-in db
-                  [:communities community-id :selected-permission-addresses]
-                  (fn [selected-addresses]
-                    (if (contains? selected-addresses address)
-                      (disj selected-addresses address)
-                      (conj selected-addresses address))))})
+  [{:keys [db]} [address]]
+  {:db (update db
+               :communities/selected-permission-addresses
+               (fn [selected-addresses]
+                 (if (contains? selected-addresses address)
+                   (disj selected-addresses address)
+                   (conj selected-addresses address))))})
 
 (rf/reg-event-fx :communities/toggle-selected-permission-address
  toggle-selected-permission-address)
 
 (rf/reg-event-fx :communities/reset-selected-permission-addresses
- (fn [{:keys [db]} [community-id]]
-   (when community-id
-     {:db (assoc-in db
-           [:communities community-id :selected-permission-addresses]
-           (get-in db [:communities community-id :previous-permission-addresses]))})))
+ (fn [{:keys [db]}]
+   {:db (assoc db
+               :communities/selected-permission-addresses
+               (get-in db [:communities/previous-permission-addresses]))}))
 
 (rf/reg-event-fx :communities/share-community-channel-url-with-data
  (fn [_ [chat-id]]
@@ -284,124 +265,5 @@
                                   :event   "share-community-channel-url-with-data"}))}]})))
 
 (rf/reg-event-fx :communities/set-airdrop-address
- (fn [{:keys [db]} [address community-id]]
-   {:db (assoc-in db [:communities community-id :airdrop-address] address)}))
-
-(defn community-fetched
-  [{:keys [db]} [community-id community]]
-  (when community
-    {:db (update db :communities/fetching-community dissoc community-id)
-     :fx [[:dispatch [:communities/handle-community community]]
-          [:dispatch
-           [:chat.ui/cache-link-preview-data (link-preview.events/community-link community-id)
-            community]]]}))
-
-(rf/reg-event-fx :chat.ui/community-fetched community-fetched)
-
-(defn community-failed-to-fetch
-  [{:keys [db]} [community-id]]
-  {:db (update db :communities/fetching-community dissoc community-id)})
-
-(rf/reg-event-fx :chat.ui/community-failed-to-fetch community-failed-to-fetch)
-
-(defn fetch-community
-  [{:keys [db]} [community-id]]
-  (when (and community-id (not (get-in db [:communities/fetching-community community-id])))
-    {:db            (assoc-in db [:communities/fetching-community community-id] true)
-     :json-rpc/call [{:method     "wakuext_fetchCommunity"
-                      :params     [{:CommunityKey    community-id
-                                    :TryDatabase     true
-                                    :WaitForResponse true}]
-                      :on-success (fn [community]
-                                    (rf/dispatch [:chat.ui/community-fetched community-id community]))
-                      :on-error   (fn [err]
-                                    (rf/dispatch [:chat.ui/community-failed-to-fetch community-id])
-                                    (log/error {:message
-                                                "Failed to request community info from mailserver"
-                                                :error err}))}]}))
-
-(schema/=> fetch-community
-  [:=>
-   [:catn
-    [:cofx :schema.re-frame/cofx]
-    [:args
-     [:schema [:catn [:community-id [:? :string]]]]]]
-   [:maybe
-    [:map
-     [:db map?]
-     [:json-rpc/call :schema.common/rpc-call]]]])
-
-(rf/reg-event-fx :communities/fetch-community fetch-community)
-
-(defn spectate-community-success
-  [{:keys [db]} [{:keys [communities]}]]
-  (when-let [community (first communities)]
-    {:db (-> db
-             (assoc-in [:communities (:id community) :spectated] true)
-             (assoc-in [:communities (:id community) :spectating] false))
-     :fx [[:dispatch [:communities/handle-community community]]
-          [:dispatch [::mailserver/request-messages]]]}))
-
-(rf/reg-event-fx :chat.ui/spectate-community-success spectate-community-success)
-
-(defn spectate-community-failed
-  [{:keys [db]} [community-id]]
-  {:db (assoc-in db [:communities community-id :spectating] false)})
-
-(rf/reg-event-fx :chat.ui/spectate-community-failed spectate-community-failed)
-
-(defn spectate-community
-  [{:keys [db]} [community-id]]
-  (let [{:keys [spectated spectating joined]} (get-in db [:communities community-id])]
-    (when (and (not joined) (not spectated) (not spectating))
-      {:db            (assoc-in db [:communities community-id :spectating] true)
-       :json-rpc/call [{:method     "wakuext_spectateCommunity"
-                        :params     [community-id]
-                        :on-success [:chat.ui/spectate-community-success]
-                        :on-error   (fn [err]
-                                      (log/error {:message
-                                                  "Failed to spectate community"
-                                                  :error err})
-                                      (rf/dispatch [:chat.ui/spectate-community-failed
-                                                    community-id]))}]})))
-
-(schema/=> spectate-community
-  [:=>
-   [:catn
-    [:cofx :schema.re-frame/cofx]
-    [:args
-     [:schema [:catn [:community-id [:? :string]]]]]]
-   [:maybe
-    [:map
-     [:db map?]
-     [:json-rpc/call :schema.common/rpc-call]]]])
-
-(rf/reg-event-fx :chat.ui/spectate-community spectate-community)
-
-(rf/defn navigate-to-serialized-community
-  [_ {:keys [community-id]}]
-  {:serialization/deserialize-and-compress-key
-   {:serialized-key community-id
-    :on-success     #(rf/dispatch [:communities/navigate-to-community-overview %])
-    :on-error       #(log/error {:message      "Failed to decompress community-id"
-                                 :error        %
-                                 :community-id community-id})}})
-
-(rf/reg-event-fx :communities/navigate-to-community-overview
- (fn [cofx [deserialized-key]]
-   (if (string/starts-with? deserialized-key constants/serialization-key)
-     (navigate-to-serialized-community cofx deserialized-key)
-     (rf/merge
-      cofx
-      {:fx [[:dispatch [:communities/fetch-community deserialized-key]]
-            [:dispatch [:navigate-to :community-overview deserialized-key]]]}
-      (navigation/pop-to-root :shell-stack)))))
-
-(rf/reg-event-fx :communities/navigate-to-community-chat
- (fn [{:keys [db]} [chat-id pop-to-root?]]
-   (let [{:keys [community-id]} (get-in db [:chats chat-id])]
-     {:fx [(when community-id
-             [:dispatch [:communities/fetch-community community-id]])
-           (if pop-to-root?
-             [:dispatch [:chat/pop-to-root-and-navigate-to-chat chat-id]]
-             [:dispatch [:chat/navigate-to-chat chat-id]])]})))
+ (fn [{:keys [db]} [address]]
+   {:db (assoc db :communities/airdrop-address address)}))

src/status_im/contexts/communities/events_test.cljs

@@ -1,31 +1,25 @@
 (ns status-im.contexts.communities.events-test
-  (:require [cljs.test :refer [deftest is testing]]
-            [legacy.status-im.mailserver.core :as mailserver]
+  (:require [cljs.test :refer [deftest is]]
             matcher-combinators.test
-            [status-im.contexts.chat.messenger.messages.link-preview.events :as link-preview.events]
             [status-im.contexts.communities.events :as events]))
 
-(def community-id "community-id")
-
 (deftest initialize-permission-addresses-test
   (let [initial-db  {:db {:wallet {:accounts {"0x1" {:address  "0x1"
                                                      :position 0}
                                               "0x2" {:address  "0x2"
                                                      :position 1}}}}}
-        expected-db {:db (update-in (:db initial-db)
-                                    [:communities community-id]
-                                    assoc
-                                    :previous-permission-addresses #{"0x1" "0x2"}
-                                    :selected-permission-addresses #{"0x1" "0x2"}
-                                    :airdrop-address               "0x1")}]
-    (is (match? expected-db (events/initialize-permission-addresses initial-db [community-id])))))
+        expected-db {:db (assoc (:db initial-db)
+                                :communities/previous-permission-addresses #{"0x1" "0x2"}
+                                :communities/selected-permission-addresses #{"0x1" "0x2"}
+                                :communities/airdrop-address               "0x1")}]
+    (is (match? expected-db (events/initialize-permission-addresses initial-db)))))
 
 (deftest toggle-selected-permission-address-test
-  (let [initial-db {:db {:communities {community-id {:selected-permission-addresses #{"0x1" "0x2"}}}}}]
-    (is (match? {:db {:communities {community-id {:selected-permission-addresses #{"0x1"}}}}}
-                (events/toggle-selected-permission-address initial-db ["0x2" community-id])))
-    (is (match? {:db {:communities {community-id {:selected-permission-addresses #{"0x1" "0x2" "0x3"}}}}}
-                (events/toggle-selected-permission-address initial-db ["0x3" community-id])))))
+  (let [initial-db {:db {:communities/selected-permission-addresses #{"0x1" "0x2"}}}]
+    (is (match? {:db {:communities/selected-permission-addresses #{"0x1"}}}
+                (events/toggle-selected-permission-address initial-db ["0x2"])))
+    (is (match? {:db {:communities/selected-permission-addresses #{"0x1" "0x2" "0x3"}}}
+                (events/toggle-selected-permission-address initial-db ["0x3"])))))
 
 (deftest update-previous-permission-addresses-test
   (let [wallet {:accounts {"0x1" {:address  "0x1"
@@ -34,162 +28,25 @@
                                   :position 1}
                            "0x3" {:address  "0x3"
                                   :position 2}}}]
-    (let [initial-db  {:db {:wallet      wallet
-                            :communities {community-id {:previous-permission-addresses #{"0x1" "0x2"}
-                                                        :selected-permission-addresses #{"0x1" "0x2"
-                                                                                         "0x3"}
-                                                        :airdrop-address               "0x1"}}}}
-          expected-db {:db {:wallet      wallet
-                            :communities {community-id {:previous-permission-addresses #{"0x1" "0x2"
-                                                                                         "0x3"}
-                                                        :selected-permission-addresses #{"0x1" "0x2"
-                                                                                         "0x3"}
-                                                        :airdrop-address               "0x1"}}}}]
+    (let [initial-db  {:db {:wallet                                    wallet
+                            :communities/previous-permission-addresses #{"0x1" "0x2"}
+                            :communities/selected-permission-addresses #{"0x1" "0x2" "0x3"}
+                            :communities/airdrop-address               "0x1"}}
+          expected-db {:db {:wallet                                    wallet
+                            :communities/previous-permission-addresses #{"0x1" "0x2" "0x3"}
+                            :communities/selected-permission-addresses #{"0x1" "0x2" "0x3"}
+                            :communities/airdrop-address               "0x1"}}]
       (is
        (match? expected-db
-               (events/update-previous-permission-addresses initial-db [community-id]))))
-    (let [initial-db  {:db {:wallet      wallet
-                            :communities {community-id {:previous-permission-addresses #{"0x1" "0x2"}
-                                                        :selected-permission-addresses #{"0x2" "0x3"}
-                                                        :airdrop-address               "0x1"}}}}
-          expected-db {:db {:wallet      wallet
-                            :communities {community-id {:previous-permission-addresses #{"0x2" "0x3"}
-                                                        :selected-permission-addresses #{"0x2" "0x3"}
-                                                        :airdrop-address               "0x2"}}}}]
+               (events/update-previous-permission-addresses initial-db))))
+    (let [initial-db  {:db {:wallet                                    wallet
+                            :communities/previous-permission-addresses #{"0x1" "0x2"}
+                            :communities/selected-permission-addresses #{"0x2" "0x3"}
+                            :communities/airdrop-address               "0x1"}}
+          expected-db {:db {:wallet                                    wallet
+                            :communities/previous-permission-addresses #{"0x2" "0x3"}
+                            :communities/selected-permission-addresses #{"0x2" "0x3"}
+                            :communities/airdrop-address               "0x2"}}]
       (is
        (match? expected-db
-               (events/update-previous-permission-addresses initial-db [community-id]))))))
-
-(deftest fetch-community
-  (testing "with community id"
-    (testing "update fetching indicator in db"
-      (is (match?
-           {:db {:communities/fetching-community {community-id true}}}
-           (events/fetch-community {} [community-id]))))
-    (testing "call the fetch community rpc method with correct community id"
-      (is (match?
-           {:json-rpc/call [{:method "wakuext_fetchCommunity"
-                             :params [{:CommunityKey    community-id
-                                       :TryDatabase     true
-                                       :WaitForResponse true}]}]}
-           (events/fetch-community {} [community-id])))))
-  (testing "with no community id"
-    (testing "do nothing"
-      (is (match?
-           nil
-           (events/fetch-community {} []))))))
-
-(deftest community-failed-to-fetch
-  (testing "given a community id"
-    (testing "remove community id from fetching indicator in db"
-      (is (match?
-           nil
-           (get-in (events/community-failed-to-fetch {:db {:communities/fetching-community
-                                                           {community-id true}}}
-                                                     [community-id])
-                   [:db :communities/fetching-community community-id]))))))
-
-(deftest community-fetched
-  (with-redefs [link-preview.events/community-link (fn [id] (str "community-link+" id))]
-    (testing "given a community"
-      (let [cofx {:db {:communities/fetching-community {community-id true}}}
-            arg  [community-id {:id community-id}]]
-        (testing "remove community id from fetching indicator in db"
-          (is (match?
-               nil
-               (get-in (events/community-fetched cofx arg)
-                       [:db :communities/fetching-community community-id]))))
-        (testing "dispatch fxs"
-          (is (match?
-               {:fx [[:dispatch [:communities/handle-community {:id community-id}]]
-                     [:dispatch
-                      [:chat.ui/cache-link-preview-data "community-link+community-id"
-                       {:id community-id}]]]}
-               (events/community-fetched cofx arg))))))
-    (testing "given a joined community"
-      (let [cofx {:db {:communities/fetching-community {community-id true}}}
-            arg  [community-id {:id community-id :joined true}]]
-        (testing "dispatch fxs, do not spectate community"
-          (is (match?
-               {:fx [[:dispatch [:communities/handle-community {:id community-id}]]
-                     [:dispatch
-                      [:chat.ui/cache-link-preview-data "community-link+community-id"
-                       {:id community-id}]]]}
-               (events/community-fetched cofx arg))))))
-    (testing "given a token-gated community"
-      (let [cofx {:db {:communities/fetching-community {community-id true}}}
-            arg  [community-id {:id community-id :tokenPermissions [1]}]]
-        (testing "dispatch fxs, do not spectate community"
-          (is (match?
-               {:fx [[:dispatch [:communities/handle-community {:id community-id}]]
-                     [:dispatch
-                      [:chat.ui/cache-link-preview-data "community-link+community-id"
-                       {:id community-id}]]]}
-               (events/community-fetched cofx arg))))))
-    (testing "given nil community"
-      (testing "do nothing"
-        (is (match?
-             nil
-             (events/community-fetched {} [community-id nil])))))))
-
-(deftest spectate-community
-  (testing "given a joined community"
-    (testing "do nothing"
-      (is (match?
-           nil
-           (events/spectate-community {:db {:communities {community-id {:joined true}}}}
-                                      [community-id])))))
-  (testing "given a spectated community"
-    (testing "do nothing"
-      (is (match?
-           nil
-           (events/spectate-community {:db {:communities {community-id {:spectated true}}}}
-                                      [community-id])))))
-  (testing "given a spectating community"
-    (testing "do nothing"
-      (is (match?
-           nil
-           (events/spectate-community {:db {:communities {community-id {:spectating true}}}}
-                                      [community-id])))))
-  (testing "given a community"
-    (testing "mark community spectating"
-      (is (match?
-           {:db {:communities {community-id {:spectating true}}}}
-           (events/spectate-community {:db {:communities {community-id {}}}} [community-id]))))
-    (testing "call spectate community rpc with correct community id"
-      (is (match?
-           {:json-rpc/call [{:method "wakuext_spectateCommunity"
-                             :params [community-id]}]}
-           (events/spectate-community {:db {:communities {community-id {}}}} [community-id]))))))
-
-(deftest spectate-community-failed
-  (testing "mark community spectating false"
-    (is (match?
-         {:db {:communities {community-id {:spectating false}}}}
-         (events/spectate-community-failed {} [community-id])))))
-
-(deftest spectate-community-success
-  (testing "given communities"
-    (testing "mark first community spectating false"
-      (is (match?
-           {:db {:communities {community-id {:spectating false}}}}
-           (events/spectate-community-success {} [{:communities [{:id community-id}]}]))))
-    (testing "mark first community spectated true"
-      (is (match?
-           {:db {:communities {community-id {:spectated true}}}}
-           (events/spectate-community-success {} [{:communities [{:id community-id}]}]))))
-    (testing "dispatch fxs for first community"
-      (is (match?
-           {:fx [[:dispatch [:communities/handle-community {:id community-id}]]
-                 [:dispatch [::mailserver/request-messages]]]}
-           (events/spectate-community-success {} [{:communities [{:id community-id}]}])))))
-  (testing "given empty community"
-    (testing "do nothing"
-      (is (match?
-           nil
-           (events/spectate-community-success {} [{:communities []}])))))
-  (testing "given nil community"
-    (testing "do nothing"
-      (is (match?
-           nil
-           (events/spectate-community-success {} []))))))
+               (events/update-previous-permission-addresses initial-db))))))