chore: merge branch 'develop' into status-go/filter-improvements

chore: disabled px to only use fleet nodes
Merge branch 'develop' into status-go/filter-improvements
2024-06-13 18:46:09 +05:30 · 2024-06-13 18:45:39 +05:30 · 2024-06-12 18:24:20 +05:30 · 2024-06-12 18:21:59 +05:30 · 2024-06-11 16:46:47 +05:30 · 2024-06-11 16:45:45 +05:30
325 changed files with 3060 additions and 6906 deletions
@@ -10,8 +10,6 @@
                legacy.status-im.utils.styles/def    clojure.core/def
                legacy.status-im.utils.styles/defn   clojure.core/defn
                test-helpers.unit/deftest-sub        clojure.core/defn
-                test-helpers.unit/deftest-event      clojure.core/defn
-
                taoensso.tufte/defnp                 clojure.core/defn}
 :linters      {:case-duplicate-test           {:level :error}
                :case-quoted-test              {:level :error}
@@ -2,7 +2,7 @@
 name: MVPBug Report
 about: MVPBug Report
 title: ''
-labels: ['E:Mobile Bug MVP', ':1234: low prio']
+labels: 'E:Mobile Bug MVP'
 assignees: ''

 ---
@@ -70,19 +70,3 @@ Documentation change PR (review please): https://github.com/status-im/status.im/
 | Please embed Image/Video here of the before and after.  | Please embed Image/Video here of the before and after.  | Please embed Image/Video here of the before and after. |

 status: ready <!-- Can be ready or wip -->
-
-<!-- Uncomment this section for status-go upgrade/dogfooding pull requests
-
- Specify potentially impacted user flows in _Areas that maybe impacted*.
- Ensure that _Steps to test_ is filled in.
-
-### Risk
-
-Described potential risks and worst case scenarios.
-
-Tick **one**:
- [ ] Low risk: 2 devs MUST perform testing as specified above and attach their results as comments to this PR **before** merging.
- [ ] High risk: QA team MUST perform additional testing in the specified affected areas **before** merging.
-
-
-->
@@ -41,7 +41,6 @@
  "reg-fx"            :arg1-pair
  "testing"           :arg1-body
  "deftest-sub"       :arg1-body
-  "deftest-event"     :arg1-body
  "test-async"        :arg1-body
  "wait-for"          :arg1-body
  "with-deps-check"   :arg1-body
@@ -447,16 +447,6 @@ android-devices: export TARGET := android-sdk
 android-devices: ##@other Invoke adb devices
 	adb devices

-android-pull-geth: export TARGET := android-sdk
-android-pull-geth: export VERSION ?= debug
-android-pull-geth:
-	adb pull "/storage/emulated/0/Android/data/im.status.ethereum$$( [ "$(VERSION)" = "release" ] || echo ".$(VERSION)" )/files/Download/geth.log"
-
-android-tail-geth: export TARGET := android-sdk
-android-tail-geth: export VERSION ?= debug
-android-tail-geth:
-	adb shell 'while true; do cat; sleep 1; done < /storage/emulated/0/Android/data/im.status.ethereum$$( [ "$(VERSION)" = "release" ] || echo ".$(VERSION)" )/files/Download/geth.log'
-
 android-logcat: export TARGET := android-sdk
 android-logcat: ##@other Read status-mobile logs from Android phone using adb
 	adb logcat | grep -e RNBootstrap -e ReactNativeJS -e ReactNative -e StatusModule -e StatusNativeLogs -e 'F DEBUG   :' -e 'Go      :' -e 'GoLog   :' -e 'libc    :'
@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 /* Options section can't access functions in objects. */
 def isPRBuild = utils.isPRBuild()
@@ -71,7 +71,7 @@ pipeline {
        }
        stage('Upload') {
          steps { script {
-            def urls = apks.collect { s5cmd.upload(it) }
+            def urls = apks.collect { s3.uploadArtifact(it) }
            if (urls.size() > 1) { /* Return only the universal APK. */
              env.PKG_URL = urls.find { it.contains('universal') }
            } else { /* If no universal is available pick first. */
@@ -1,7 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
-
-import groovy.json.JsonBuilder
+library 'status-jenkins-lib@v1.8.12'

 pipeline {
  agent { label 'linux' }
@@ -74,7 +72,7 @@ pipeline {
          iOS: utils.pkgUrl(ios),
          Diawi: utils.getEnv(ios, 'DIAWI_URL'),
          /* upload the sha256 checksums file too */
-          SHA: s5cmd.upload(sha),
+          SHA: s3.uploadArtifact(sha),
        ]
        /* add URLs to the build description */
        jenkins.setBuildDesc(urls)
@@ -85,7 +83,7 @@ pipeline {
      steps { script {
        switch (utils.getBuildType()) {
          case 'nightly': /* Create JSON file with newest build URLs */
-            updateBucketJSON(urls, 'latest.json');
+            s3.updateBucketJSON(urls, 'latest.json');
            break;
          case 'release':
            github.publishReleaseFiles(repo: 'status-mobile');
@@ -116,22 +114,3 @@ def Boolean getPublishDefault(Boolean previousValue) {
  if (previousValue != null) { return previousValue }
  return false
 }
-
-/* Helper for updating JSON with newest builds. */
-def updateBucketJSON(urls, fileName) {
-  /* latest.json has slightly different key names */
-  def content = [
-    DIAWI: urls.Diawi,
-    APK: urls.Apk, IOS: urls.iOS,
-    APP: urls.App, MAC: urls.Mac,
-    WIN: urls.Win, SHA: urls.SHA
-  ]
-  def filePath = "${pwd()}/pkg/${fileName}"
-  /* it might not exist */
-  sh "mkdir -p ${pwd()}/pkg"
-  def contentJson = new JsonBuilder(content).toPrettyString()
-  println "${filePath}:\n${contentJson}"
-  writeFile(file: filePath, text: contentJson)
-  return s5cmd.upload(filePath)
-}
-
@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 pipeline {
  agent { label 'linux' }
@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 /* Options section can't access functions in objects. */
 def isPRBuild = utils.isPRBuild()
@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 /* Options section can't access functions in objects. */
 def isPRBuild = utils.isPRBuild()
@@ -75,7 +75,7 @@ pipeline {
    stage('Upload') {
      steps {
        script {
-          env.PKG_URL = s5cmd.upload(LOG_FILE)
+          env.PKG_URL = s3.uploadArtifact(LOG_FILE)
        }
      }
    }
@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 pipeline {

@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 pipeline {

@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 pipeline {

@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 pipeline {
  agent { label 'macos' }
@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 pipeline {
  agent { label params.AGENT_LABEL }
@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 pipeline {
  agent { label 'linux' }
@@ -1,5 +1,5 @@
 #!/usr/bin/env groovy
-library 'status-jenkins-lib@v1.9.1'
+library 'status-jenkins-lib@v1.8.12'

 pipeline {
  agent {
@@ -32,16 +32,14 @@ status-mobile code that makes it to the `develop` branch, should always point to
 In practice, this means that sometimes they need to be merged in lockstep.
 1) Create a PR in status-go and status-mobile. Update the status-go version to the PR revision `scripts/update-status-go.sh $git_revision`.
 2) Get both PRs reviewed and approved. Once status-mobile PR has been approved, go through manual QA testing if necessary. Don't merge status-mobile PR just yet.
-3) Now that you know the integration between client & server is working, merge the status-go PR first.
-4) Once merged, tag the merged commit with the new version and push the tag:
+3) Now that you know the integration between client & server is working, bump the `VERSION` in status-go and merge it.
+4) Once merged, tag the version with the new version and push the tag:
 ```
  git checkout develop
  git pull develop
-  make tag-version
+  git tag vx.y.z
  git push origin vx.y.z
 ```
-:warning: If a specific commit need to tagged in status-go, use `make tag-version TARGET_COMMIT={hash}`. More info about tagging in [status-go](https://github.com/status-im/status-go/blob/develop/RELEASING.md#tagging-versions).
-
 5) Update status-mobile with the new status-go version, using the new tag `scripts/update-status-go.sh "vx.y.z"`
 6) If you had to rebase status-go to include new changes, e2e test MUST be re-run. If there's any issue you will
   have to fix in status-go with another PR and follow the same process.
@@ -31,7 +31,7 @@ NOW:
 (defn view
  [{:keys [on-press on-long-press icon]}]
  (let [[pressed? set-pressed] (rn/use-state false)
-        theme                  (theme/use-theme)
+        theme                  (theme/use-theme-value)
        on-press-in            (rn/use-callback #(set-pressed true))
        on-press-out           (rn/use-callback #(set-pressed nil))]
    [rn/pressable
@@ -47,7 +47,7 @@ NOW:
 - We no longer need to create an anonymous function for rendering. This removes unnecessary confusion and the need for specific knowledge on how it works and why it was needed.
 - `rn/use-state` is used instead of `reagent/atom`
 - State values no longer need to be dereferenced; they are accessible as regular symbols. This eliminates a common bug where the "@" symbol was inadvertently omitted.
- `theme/with-theme` wrapper is not needed anymore, `(theme/use-theme)` hook can be used directly in the components
+- `theme/with-theme` wrapper is not needed anymore, `(theme/use-theme-value)` hook can be used directly in the components
 - `:f>` not needed anymore, all components are functional by default
 - `rn/use-callback` hook should be used for anon callback functions

@@ -119,6 +119,8 @@
 	<array>
 		<string>armv7</string>
 	</array>
+	<key>UIStatusBarStyle</key>
+	<string>UIStatusBarStyleLightContent</string>
 	<key>UISupportedInterfaceOrientations</key>
 	<array>
 		<string>UIInterfaceOrientationPortrait</string>
@@ -131,7 +133,7 @@
 		<string>UIInterfaceOrientationLandscapeRight</string>
 	</array>
 	<key>UIViewControllerBasedStatusBarAppearance</key>
-	<true/>
+	<false/>
 	<key>com.apple.developer.nfc.readersession.iso7816.select-identifiers</key>
 	<array>
 		<string>A00000080400010101</string>
@@ -57,7 +57,7 @@ in {
  yarn = super.yarn.override { nodejs = super.nodejs-18_x; };
  openjdk = super.openjdk11_headless;
  xcodeWrapper = callPackage ./pkgs/xcodeenv/compose-xcodewrapper.nix { } {
-    versions = ["15.1" "15.2" "15.3" "15.4"];
+    versions = ["15.1" "15.2" "15.3"];
  };
  go = super.go_1_21;
  clang = super.clang_15;
@@ -20,10 +20,9 @@
    "@react-native-community/netinfo": "^4.4.0",
    "@react-native-community/push-notification-ios": "^1.4.1",
    "@react-native-community/slider": "^3.0.0",
-    "@walletconnect/react-native-compat": "2.11.2",
-    "@walletconnect/web3wallet": "1.10.2",
+    "@walletconnect/react-native-compat": "^2.12.2",
+    "@walletconnect/web3wallet": "^1.11.2",
    "base-64": "^1.0.0",
-    "big-integer": "1.6.51",
    "bignumber.js": "git+https://github.com/status-im/bignumber.js.git#refs/tags/v4.0.2-status",
    "chance": "^1.1.0",
    "emojilib": "^2.4.0",
@@ -131,8 +131,7 @@
   :output-dir "target/test"
   :optimizations :simple
   :target :node-test
-   :dev {:devtools {:preloads [status-im.setup.schema-preload
-                               status-im.setup.test-preload]}}
+   :dev {:devtools {:preloads [status-im.setup.schema-preload]}}
   ;; Uncomment line below to `make test-watch` a specific file
   :ns-regexp #shadow/env "SHADOW_NS_REGEXP"
   :main legacy.status-im.test-runner/main
@@ -38,12 +38,10 @@
    :always
    (update :contacts conj (:id member))))

-(defn community-chat-id->channel-id [chat-id] (subs chat-id constants/community-id-length))
-
 (defn decode-chat-id
  [chat-id]
  (let [community-id (subs chat-id 0 constants/community-id-length)
-        channel-id   (community-chat-id->channel-id chat-id)]
+        channel-id   (subs chat-id constants/community-id-length)]
    {:community-id community-id
     :channel-id   channel-id}))

@@ -135,8 +135,7 @@
                                 (>= (- now app-in-background-since)
                                     constants/ms-in-bg-for-require-bioauth))]
    (rf/merge cofx
-              {:db                                   (dissoc db :app-in-background-since)
-               :effects.biometric/get-supported-type nil}
+              {:db (dissoc db :app-in-background-since)}
              (mailserver/process-next-messages-request)
              (when-not new-account?
                (universal-links/process-stored-event))
@@ -28,7 +28,7 @@
  [{:keys [db] :as cofx} {:keys [auth-method logout?]}]
  (let [key-uid (get-in db [:profile/profile :key-uid])]
    (rf/merge cofx
-              {:dispatch                               [:init-root :progress]
+              {:set-root                               :progress
               :effects.shell/reset-state              nil
               :hide-popover                           nil
               ::logout                                nil
@@ -17,7 +17,7 @@
 (reg-root-key-sub :ui/search :ui/search)
 (reg-root-key-sub :network/type :network/type)
 (reg-root-key-sub :network-status :network-status)
-(reg-root-key-sub :peer-stats/count :peer-stats/count)
+(reg-root-key-sub :peers-count :peers-count)
 (reg-root-key-sub :peers-summary :peers-summary)
 (reg-root-key-sub :web3-node-version :web3-node-version)

@@ -1,9 +1,14 @@
 (ns legacy.status-im.ui.components.connectivity.view
  (:require
+    [clojure.string :as string]
    [legacy.status-im.ui.components.animation :as animation]
    [legacy.status-im.ui.components.colors :as colors]
-    [legacy.status-im.ui.components.react :as react])
-  (:require-macros [legacy.status-im.utils.views :as views]))
+    [legacy.status-im.ui.components.core :as quo]
+    [legacy.status-im.ui.components.list.item :as list.item]
+    [legacy.status-im.ui.components.react :as react]
+    [re-frame.core :as re-frame]
+    [utils.i18n :as i18n])
+  (:require-macros [legacy.status-im.utils.views :as views :refer [defview letsubs]]))

 (defn easing
  [direction n]
@@ -67,3 +72,112 @@
                                          colors/white)
                      :left
                      (* 0.15 parent-width))}]]]))
+
+(defview loading-indicator
+  []
+  (letsubs [fetching?    [:mailserver/fetching?]
+            window-width [:dimensions/window-width]]
+    (when fetching?
+      [loading-indicator-anim window-width])))
+
+(defn hide-sheet-and-dispatch
+  [event]
+  (re-frame/dispatch [:bottom-sheet/hide-old])
+  (re-frame/dispatch event))
+
+(defview connectivity-sheet
+  []
+  (letsubs [{:keys [peers node mobile sync]}     [:connectivity/state]
+            current-mailserver-name              [:mailserver/current-name]
+            peers-count                          [:peers-count]
+            {:keys [syncing-on-mobile-network?]} [:profile/profile]]
+    [:<>
+     [quo/header {:title (i18n/label :t/connection-status) :border-bottom false}]
+     [quo/list-header (i18n/label :t/peer-to-peer)]
+     (if (= peers :offline)
+       [list.item/list-item
+        {:title               (i18n/label :t/not-connected-to-peers)
+         :accessibility-label "not-connected-to-peers"
+         :subtitle            (i18n/label :t/unable-to-send-messages)
+         :subtitle-max-lines  2
+         :theme               :negative
+         :icon                :main-icons/network}]
+       [list.item/list-item
+        {:title               (str (i18n/label :t/connected-to)
+                                   " " peers-count
+                                   " " (string/lower-case (i18n/label :t/peers)))
+         :accessibility-label "connected-to-n-peers"
+         :subtitle            (i18n/label :t/can-send-messages)
+         :subtitle-max-lines  2
+         :theme               :positive
+         :icon                :main-icons/network}])
+     [quo/list-header (i18n/label :t/history-nodes)]
+     (cond
+       (#{:error :offline} node)
+       [list.item/list-item
+        {:title               (i18n/label :t/not-connected-nodes)
+         :accessibility-label "not-connected-nodes"
+         :subtitle            (i18n/label :t/unable-to-fetch)
+         :theme               :negative
+         :icon                :main-icons/mailserver}]
+       (= node :disabled)
+       [list.item/list-item
+        {:title               (i18n/label :t/nodes-disabled)
+         :accessibility-label "nodes-disabled"
+         :subtitle            (i18n/label :t/unable-to-fetch)
+         :disabled            true
+         :icon                :main-icons/mailserver}]
+       (and mobile (not sync))
+       [list.item/list-item
+        {:title               (i18n/label :t/waiting-wi-fi)
+         :accessibility-label "waiting-wi-fi"
+         :subtitle            (i18n/label :t/unable-to-fetch)
+         :disabled            true
+         :icon                :main-icons/mailserver}]
+       (= node :connecting)
+       [list.item/list-item
+        {:title               (i18n/label :t/connecting)
+         :accessibility-label "connecting"
+         :subtitle            (i18n/label :t/unable-to-fetch)
+         :icon                :main-icons/mailserver}]
+       (= node :online)
+       [list.item/list-item
+        {:title               (str (i18n/label :t/connected-to) " " current-mailserver-name)
+         :accessibility-label "connected-to-mailserver"
+         :subtitle            (i18n/label :t/you-can-fetch)
+         :theme               :positive
+         :icon                :main-icons/mailserver}])
+     [list.item/list-item
+      {:title               (i18n/label :t/settings)
+       :accessibility-label "settings"
+       :theme               :accent
+       :on-press            #(hide-sheet-and-dispatch [:navigate-to :legacy-sync-settings])
+       :icon                :main-icons/settings}]
+     (when mobile
+       [:<>
+        [react/view
+         {:margin-vertical  8
+          :background-color colors/gray-lighter
+          :height           36
+          :align-items      :center
+          :justify-content  :center}
+         [react/text {:style {:color colors/gray}} (i18n/label :t/youre-on-mobile-network)]]
+        [list.item/list-item
+         {:title               (i18n/label :t/mobile-network-use-mobile)
+          :accessibility-label "mobile-network-use-mobile"
+          :accessory           :switch
+          :on-press            #(re-frame/dispatch [:mobile-network/set-syncing
+                                                    (not syncing-on-mobile-network?)])
+          :active              syncing-on-mobile-network?}]
+        [react/text {:style {:margin-horizontal 16 :margin-bottom 12 :color colors/gray}}
+         (i18n/label :t/status-mobile-descr)]])]))
+
+(defn get-icon
+  [{:keys [peers node mobile sync]}]
+  (if (or (= peers :offline)
+          (= node :offline)
+          (= node :connecting))
+    :main-icons/offline
+    (if mobile
+      (if sync :main-icons/mobile-sync :main-icons/mobile-sync-off)
+      (when (#{:error :disabled} node) :main-icons/node-offline))))
@@ -13,7 +13,6 @@
   constants/one-day    (i18n/label :t/one-day)
   constants/three-days (i18n/label :t/three-days)
   constants/one-week   (i18n/label :t/one-week)
-   constants/nine-days  (i18n/label :t/nine-days)
   constants/one-month  (i18n/label :t/one-month)})

 (defn radio-item
@@ -35,5 +34,4 @@
     [radio-item constants/one-day default-sync-period]
     [radio-item constants/three-days default-sync-period]
     [radio-item constants/one-week default-sync-period]
-     [radio-item constants/nine-days default-sync-period]
     [radio-item constants/one-month default-sync-period]]))
@@ -6,7 +6,6 @@
    [legacy.status-im.ui.components.react :as react]
    [quo.core :as quo]
    [react-native.platform :as platform]
-    [taoensso.timbre :as log]
    [utils.i18n :as i18n]
    [utils.re-frame :as rf]))

@@ -58,15 +57,7 @@
       :accessibility-label :local-notifications-settings-button
       :subtitle            (i18n/label :t/local-notifications-subtitle)
       :active              notifications-enabled?
-       :on-press            (fn []
-                              (when-not notifications-enabled?
-                                (rf/dispatch
-                                 [:request-permissions
-                                  {:permissions [:post-notifications]
-                                   :on-allowed  #(log/info "push notification permissions were allowed")
-                                   :on-denied   #(log/error
-                                                  "user denied push notification permissions")}]))
-                              (rf/dispatch [:push-notifications/switch (not notifications-enabled?)]))
+       :on-press            #(rf/dispatch [:push-notifications/switch (not notifications-enabled?)])
       :accessory           :switch}]]))

 (defn notifications-settings
@@ -1,21 +1,17 @@
 (ns legacy.status-im.ui.screens.peers-stats
  (:require
-    [react-native.core :as rn]
+    [react-native.core :as react-native.core]
    [utils.i18n :as i18n]
-    [utils.re-frame :as rf]))
+    [utils.re-frame :as re-frame]))

 (defn peers-stats
  []
-  (let [peers-count (rf/sub [:peer-stats/count])]
-    (rn/use-mount
-     (fn []
-       (rf/dispatch [:peer-stats/get-count])))
-
-    [rn/view
-     {:style {:flex              1
-              :margin-horizontal 8}}
-     [rn/view
+  (let [peers-count (re-frame/sub [:peers-count])]
+    [react-native.core/view
+     {:flex              1
+      :margin-horizontal 8}
+     [react-native.core/view
      {:style {:flex-direction  :row
               :margin-vertical 8
               :justify-content :space-between}}
-      [rn/text (str (i18n/label :t/peers-count) ": " peers-count)]]]))
+      [react-native.core/text (str (i18n/label :t/peers-count) ": " peers-count)]]]))
@@ -53,8 +53,7 @@
  []
  [;;PROGRESS
   {:name      :progress
-    :options   {:insets {:top? true}
-                :theme  :dark}
+    :options   {:insets {:top? true}}
    :component progress/progress}

   ;;COMMUNITY
@@ -57,21 +57,14 @@
        :accessory-text      (cond
                               (= default-sync-period constants/two-mins)
                               (i18n/label :t/two-minutes)
-
                               (or
                                (nil? default-sync-period)
                                (= default-sync-period constants/one-day))
                               (i18n/label :t/one-day)
-
                               (= default-sync-period constants/three-days)
                               (i18n/label :t/three-days)
-
-                               (= default-sync-period constants/nine-days)
-                               (i18n/label :t/nine-days)
-
                               (= default-sync-period constants/one-week)
                               (i18n/label :t/one-week)
-
                               (= default-sync-period constants/one-month)
                               (i18n/label :t/one-month))}]
      [list.item/list-item
@@ -128,6 +128,7 @@
                                                 :current-chat-id
                                                 :network
                                                 :network-status
+                                                 :peers-count
                                                 :peers-summary
                                                 :sync-state
                                                 :view-id
@@ -130,7 +130,7 @@
             status-type]}]
          (and
           (= status-type constants/visibility-status-inactive)
-           (pos? (:peer-stats/count db)))
+           (> (:peers-count db) 0))
          ;; Disable broadcasting further updates
          (conj {:ms 1000
                 :dispatch
@@ -2,7 +2,7 @@
  (:require
    [quo.components.buttons.button.view :as button]
    [quo.components.buttons.predictive-keyboard.style :as style]
-    [quo.components.info.info-message.view :as info-message]
+    [quo.components.info.info-message :as info-message]
    [quo.foundations.colors :as colors]
    [quo.theme]
    [react-native.core :as rn]
@@ -57,17 +57,17 @@
          :key-fn                            str}]

        :error
-        [info-message/view
-         {:icon   :i/info
-          :size   :default
-          :status :error}
+        [info-message/info-message
+         {:icon :i/info
+          :size :default
+          :type :error}
         text]

        :info
-        [info-message/view
-         (merge {:icon   :i/info
-                 :size   :default
-                 :status (if (= type :error) :error :default)}
+        [info-message/info-message
+         (merge {:icon :i/info
+                 :size :default
+                 :type (if (= type :error) :error :default)}
                (when blur?
                  {:text-color colors/white-opa-70
                   :icon-color colors/white-opa-40}))
@@ -14,7 +14,9 @@
    [react-native.reanimated :as reanimated]))

 (defn drag-gesture
-  [x-pos disabled? track-width sliding-complete? set-sliding-complete on-complete reset-fn]
+  [x-pos disabled? track-width sliding-complete?
+   set-sliding-complete
+   on-complete reset-fn]
  (-> (gesture/gesture-pan)
      (gesture/with-test-ID :slide-button-gestures)
      (gesture/enabled (not disabled?))
@@ -26,8 +28,7 @@
                             (reanimated/set-shared-value x-pos clamped-x)
                             (when (and reached-end? (not sliding-complete?))
                               (set-sliding-complete true)
-                               (when on-complete
-                                 (on-complete reset-fn))))))
+                               (when on-complete (on-complete reset-fn))))))
      (gesture/on-end (fn [event]
                        (let [x-translation (oops/oget event "translationX")
                              reached-end?  (>= x-translation track-width)]
@@ -55,10 +56,9 @@
        on-track-layout               (rn/use-callback
                                       #(set-track-width (oops/oget % "nativeEvent.layout.width")))
        reset-fn                      (rn/use-callback
-                                       (fn [keep-at-end-after-slide?]
+                                       (fn []
                                         (set-sliding-complete false)
-                                         (when-not keep-at-end-after-slide?
-                                           (animations/reset-track-position x-pos))))
+                                         (animations/reset-track-position x-pos)))
        dimensions                    (rn/use-callback
                                       (partial utils/get-dimensions
                                                (or track-width constants/default-width)
@@ -71,16 +71,14 @@
                                                (dimensions :thumb))
                                       [dimensions])
        custom-color                  (if (= type :danger) :danger customization-color)
-        gesture                       (rn/use-memo
-                                       (fn []
-                                         (drag-gesture x-pos
-                                                       disabled?
-                                                       (dimensions :usable-track)
-                                                       sliding-complete?
-                                                       set-sliding-complete
-                                                       on-complete
-                                                       reset-fn))
-                                       [sliding-complete? disabled? on-complete])]
+        gesture                       (rn/use-memo #(drag-gesture x-pos
+                                                                  disabled?
+                                                                  (dimensions :usable-track)
+                                                                  sliding-complete?
+                                                                  set-sliding-complete
+                                                                  on-complete
+                                                                  reset-fn)
+                                                   [sliding-complete? disabled?])]
    [gesture/gesture-detector
     {:gesture gesture}
     [reanimated/view
@@ -8,11 +8,10 @@
    [react-native.core :as rn]))

 (defn- get-icon-color
-  [blur? danger? theme]
-  (cond
-    danger? (colors/theme-colors colors/danger-50 colors/danger-60 theme)
-    blur?   colors/white-opa-70
-    :else   (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)))
+  [danger? theme]
+  (if danger?
+    (colors/theme-colors colors/danger-50 colors/danger-60 theme)
+    (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)))

 (defn- divider
  [theme blur?]
@@ -52,7 +51,7 @@
           :accessible          true
           :style               (style/left-icon sub-label)}
          [icon/icon icon
-           {:color    (or icon-color (get-icon-color blur? danger? theme))
+           {:color    (or icon-color (get-icon-color danger? theme))
            :no-color no-icon-color?
            :size     20}]])
       [rn/view
@@ -85,7 +84,7 @@
              :accessible          true
              :accessibility-label :right-icon-for-action}
             [icon/icon right-icon
-              {:color (get-icon-color blur? danger? theme)
+              {:color (get-icon-color danger? theme)
               :size  20}]])
          (when (= state :selected)
            [rn/view {:style style/right-icon}
@@ -20,9 +20,8 @@
  {:background-color (when-not (or scroll? blur?)
                       (colors/theme-colors colors/white colors/neutral-95 theme))})

-(defn buttons-container
-  [actions]
-  {:flex-direction     (if (= actions :two-vertical-actions) :column :row)
+(def buttons-container
+  {:flex-direction     :row
   :justify-content    :space-around
   :padding-vertical   12
   :gap                12
@@ -17,9 +17,9 @@
   [:catn
    [:props
     [:map {:closed true}
-      [:actions [:maybe [:enum :one-action :two-actions :two-vertical-actions]]]
+      [:actions [:maybe [:enum :one-action :two-actions]]]
      [:description {:optional true} [:maybe [:enum :top :bottom :top-error]]]
-      [:description-text {:optional true} [:maybe [:or :string :schema.common/hiccup]]]
+      [:description-text {:optional true} [:maybe :string]]
      [:description-top-text {:optional true} [:maybe :string]]
      [:error-message {:optional true} [:maybe :string]]
      [:role {:optional true} [:maybe [:enum :admin :member :token-master :owner]]]
@@ -72,9 +72,8 @@
            :context (i18n/label (keyword "t" role))}
           context-tag-props)]])

-     [rn/view {:style (style/buttons-container actions)}
-      (when (or (= actions :two-actions)
-                (= actions :two-vertical-actions))
+     [rn/view {:style style/buttons-container}
+      (when (= actions :two-actions)
        [button/button
         (merge
          {:size                40
@@ -94,10 +93,8 @@
        button-one-props)
       button-one-label]]
     (when (= description :bottom)
-       (if (string? description-text)
-         [text/text
-          {:size  :paragraph-2
-           :style (style/description-bottom scroll? blur? theme)} description-text]
-         description-text))]))
+       [text/text
+        {:size  :paragraph-2
+         :style (style/description-bottom scroll? blur? theme)} description-text])]))

 (def view (schema/instrument #'view-internal ?schema))
@@ -18,7 +18,7 @@

 (defn- left-image
  [{:keys [type customization-color account-avatar-emoji account-avatar-type icon-avatar
-           profile-picture blur?]}]
+           profile-picture]}]
  (case type
    :account         [account-avatar/view
                      {:customization-color customization-color
@@ -28,7 +28,6 @@
    :keypair         [icon-avatar/icon-avatar
                      {:icon    icon-avatar
                       :border? true
-                       :blur?   blur?
                       :color   :neutral}]

    :default-keypair [user-avatar/user-avatar
@@ -214,7 +213,6 @@
       [rn/view {:style style/left-container}
        [left-image
         {:type                 type
-          :blur?                blur?
          :customization-color  customization-color
          :account-avatar-emoji account-avatar-emoji
          :account-avatar-type  account-avatar-type
@@ -0,0 +1,48 @@
+(ns quo.components.info.info-message
+  (:require
+    [quo.components.icon :as quo.icons]
+    [quo.components.markdown.text :as text]
+    [quo.foundations.colors :as colors]
+    [quo.theme :as quo.theme]
+    [react-native.core :as rn]))
+
+(defn get-color
+  [k theme]
+  (case k
+    :success (colors/resolve-color :success theme)
+    :error   (colors/resolve-color :danger theme)
+    :warning (colors/resolve-color :warning theme)
+    (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)))
+
+(defn info-message
+  "[info-message opts \"message\"]
+  opts
+  {:type           :default/:success/:error
+   :size           :default/:tiny
+   :icon           :i/info       ;; info message icon
+   :text-color     colors/white  ;; text color override
+   :icon-color     colors/white  ;; icon color override
+   :no-icon-color? false         ;; disable tint color for icon"
+  [{:keys [type size icon text-color icon-color no-icon-color? style accessibility-label
+           container-style]} message]
+  (let [theme      (quo.theme/use-theme)
+        weight     (if (= size :default) :regular :medium)
+        icon-size  (if (= size :default) 16 12)
+        size       (if (= size :default) :paragraph-2 :label)
+        text-color (or text-color (get-color type theme))
+        icon-color (or icon-color text-color)]
+    [rn/view
+     {:style (merge {:flex-direction :row
+                     :align-items    :center}
+                    style
+                    container-style)}
+     [quo.icons/icon icon
+      {:color    icon-color
+       :no-color no-icon-color?
+       :size     icon-size}]
+     [text/text
+      {:accessibility-label accessibility-label
+       :size                size
+       :weight              weight
+       :style               {:color             text-color
+                             :margin-horizontal 4}} message]]))
@@ -1,32 +0,0 @@
-(ns quo.components.info.info-message.component-spec
-  (:require
-    [quo.components.info.info-message.view :as info-message]
-    [test-helpers.component :as h]))
-
-(h/describe "Info: Info Message"
-  (h/test "basic render"
-    (h/render-with-theme-provider
-     [info-message/view
-      {:status              :default
-       :size                :default
-       :accessibility-label :info-message
-       :icon                :i/placeholder} "Message"])
-    (h/is-truthy (h/get-by-label-text :info-message)))
-
-  (h/test "render with correct message"
-    (h/render-with-theme-provider
-     [info-message/view
-      {:status              :default
-       :size                :default
-       :accessibility-label :info-message
-       :icon                :i/placeholder} "Message"])
-    (h/is-truthy (h/get-by-text "Message")))
-
-  (h/test "render icon"
-    (h/render-with-theme-provider
-     [info-message/view
-      {:status              :default
-       :size                :default
-       :accessibility-label :info-message
-       :icon                :i/placeholder} "Message"])
-    (h/is-truthy (h/get-by-label-text :icon))))
@@ -1,6 +0,0 @@
-(ns quo.components.info.info-message.style)
-
-(def container
-  {:flex-direction :row
-   :gap            4
-   :align-items    :center})
@@ -1,53 +0,0 @@
-(ns quo.components.info.info-message.view
-  (:require [quo.components.icon :as icons]
-            [quo.components.info.info-message.style :as style]
-            [quo.components.markdown.text :as text]
-            [quo.foundations.colors :as colors]
-            [quo.theme :as quo.theme]
-            [react-native.core :as rn]
-            [schema.core :as schema]))
-
-(def ?schema
-  [:=>
-   [:catn
-    [:props
-     [:map {:closed true}
-      [:status {:optional true} [:maybe [:enum :default :success :error :warning]]]
-      [:size {:optional true} [:maybe [:enum :default :tiny]]]
-      [:blur? {:optional true} [:maybe :boolean]]
-      [:icon :keyword]
-      [:color {:optional true} [:maybe :string]]
-      [:text-color {:optional true} [:maybe :string]]
-      [:icon-color {:optional true} [:maybe :string]]
-      [:no-icon-color? {:optional true} [:maybe :boolean]]
-      [:accessibility-label {:optional true} [:maybe :keyword]]
-      [:container-style {:optional true} [:maybe :map]]]]
-    [:message :string]]
-   :any])
-
-(defn- get-color
-  [status theme blur?]
-  (case status
-    :success (if blur? colors/success-60 (colors/resolve-color :success theme))
-    :error   (if blur? colors/danger-60 (colors/resolve-color :danger theme))
-    :warning (if blur? colors/warning-60 (colors/resolve-color :warning theme))
-    (if blur? colors/white-opa-40 (colors/theme-colors colors/neutral-50 colors/neutral-40 theme))))
-
-(defn view-internal
-  [{:keys [status size blur? icon color icon-color text-color no-icon-color? container-style
-           accessibility-label]} message]
-  (let [theme         (quo.theme/use-theme)
-        default-color (get-color status theme blur?)
-        text-color    (or text-color color default-color)
-        icon-color    (or icon-color color default-color)]
-    [rn/view {:style (merge style/container container-style)}
-     [icons/icon icon
-      {:size      (if (= size :tiny) 12 16)
-       :color     icon-color
-       :no-color? no-icon-color?}]
-     [text/text
-      {:size                (if (= size :tiny) :label :paragraph-2)
-       :accessibility-label accessibility-label
-       :style               {:color text-color}} message]]))
-
-(def view (schema/instrument #'view-internal ?schema))
@@ -4,19 +4,19 @@
    [quo.foundations.colors :as colors]))

 (defn placeholder-color
-  [state blur? theme]
+  [state blur? override-theme]
  (cond
    (and blur? (= state :active))
-    (colors/theme-colors colors/neutral-80-opa-20 colors/white-opa-20 theme)
+    (colors/theme-colors colors/neutral-80-opa-20 colors/white-opa-20 override-theme)

    blur? ; state is default
-    (colors/theme-colors colors/neutral-80-opa-40 colors/white-opa-30 theme)
+    (colors/theme-colors colors/neutral-80-opa-40 colors/white-opa-30 override-theme)

    (= state :active)
-    (colors/theme-colors colors/neutral-30 colors/neutral-60 theme)
+    (colors/theme-colors colors/neutral-30 colors/neutral-60 override-theme)

    :else ; Not blur and state is default
-    (colors/theme-colors colors/neutral-40 colors/neutral-50 theme)))
+    (colors/theme-colors colors/neutral-40 colors/neutral-50 override-theme)))

 (def clear-icon-container
  {:justify-content :center
@@ -26,14 +26,16 @@
   :width           20})

 (defn clear-icon
-  [blur? theme]
+  [blur? override-theme]
  (if blur?
-    (colors/theme-colors colors/neutral-80-opa-30 colors/white-opa-10 theme)
-    (colors/theme-colors colors/neutral-40 colors/neutral-60 theme)))
+    (colors/theme-colors colors/neutral-80-opa-30 colors/white-opa-10 override-theme)
+    (colors/theme-colors colors/neutral-40 colors/neutral-60 override-theme)))

 (defn cursor
-  [customization-color theme]
-  (colors/resolve-color customization-color theme))
+  [customization-color override-theme]
+  (colors/theme-colors (colors/custom-color customization-color 50)
+                       (colors/custom-color customization-color 60)
+                       override-theme))

 (def tag-separator {:width 8})

@@ -59,10 +61,10 @@
   :justify-content :flex-start})

 (defn input-text
-  [disabled? theme]
+  [disabled?]
  (assoc (text/text-style {:size   :paragraph-1
                           :weight :regular}
-                          theme)
+                          nil)
         :flex             1
         :padding-vertical 5
         :min-width        120
@@ -4,7 +4,6 @@
    [quo.components.icon :as icon]
    [quo.components.inputs.search-input.style :as style]
    [quo.foundations.colors :as colors]
-    [quo.theme]
    [react-native.core :as rn]))

 (def ^:private tag-separator [rn/view {:style style/tag-separator}])
@@ -16,12 +15,12 @@
        tags-coll))

 (defn- clear-button
-  [{:keys [on-press blur? theme]}]
+  [{:keys [on-press blur? override-theme]}]
  [rn/touchable-opacity
   {:style    style/clear-icon-container
    :on-press on-press}
   [icon/icon :i/clear
-    {:color (style/clear-icon blur? theme)
+    {:color (style/clear-icon blur? override-theme)
     :size  20}]])

 (defn- handle-backspace
@@ -32,7 +31,7 @@

 (def ^:private props-to-remove
  [:cursor-color :placeholder-text-color :editable :on-change-text :on-focus
-   :on-blur :on-clear :value :tags :disabled? :blur? :customization-color])
+   :on-blur :on-clear :value :tags :disabled? :blur? :customization-color :override-theme])

 (defn- add-children
  [text-input children]
@@ -41,13 +40,12 @@
    text-input))

 (defn search-input
-  [{:keys [value tags disabled? blur? on-change-text customization-color show-clear-button?
-           on-clear on-focus on-blur container-style]
+  [{:keys [value tags disabled? blur? on-change-text customization-color
+           on-clear on-focus on-blur override-theme container-style]
    :or   {customization-color :blue}
    :as   props}
   & children]
-  (let [theme              (quo.theme/use-theme)
-        [state set-state]  (rn/use-state :default)
+  (let [[state set-state]  (rn/use-state :default)
        on-focus           (rn/use-callback
                            (fn []
                              (set-state :active)
@@ -74,20 +72,20 @@
        [inner-tags tags])
      (add-children
       [rn/text-input
-        (cond-> {:style                  (style/input-text disabled? theme)
-                 :cursor-color           (style/cursor customization-color theme)
-                 :placeholder-text-color (style/placeholder-color state blur? theme)
+        (cond-> {:style                  (style/input-text disabled?)
+                 :cursor-color           (style/cursor customization-color override-theme)
+                 :placeholder-text-color (style/placeholder-color state blur? override-theme)
                 :editable               (not disabled?)
                 :on-key-press           on-key-press
-                 :keyboard-appearance    (colors/theme-colors :light :dark theme)
+                 :keyboard-appearance    (colors/theme-colors :light :dark override-theme)
                 :on-change-text         on-change-text
                 :on-focus               on-focus
                 :on-blur                on-blur}
          use-value?        (assoc :value value)
          (seq clean-props) (merge clean-props))]
       (when-not use-value? children))]
-     (when (or (seq value) (seq children) show-clear-button?)
+     (when (or (seq value) (seq children))
       [clear-button
-        {:on-press on-clear
-         :blur?    blur?
-         :theme    theme}])]))
+        {:on-press       on-clear
+         :blur?          blur?
+         :override-theme override-theme}])]))
@@ -13,7 +13,7 @@
               {:value      ""
                :max-length 24}])
    (h/fire-event :on-focus (h/query-by-label-text :profile-title-input))
-    (-> (h/wait-for #(h/get-by-text "0"))
+    (-> (h/wait-for #(h/get-by-text "00"))
        (.then #(h/is-truthy (h/query-by-text "/24")))))

  (h/test "renders with max length digits and character count"
@@ -22,7 +22,7 @@
                :max-length    24}
               "abc"])
    (h/fire-event :on-focus (h/query-by-label-text :profile-title-input))
-    (-> (h/wait-for #(h/get-by-text "3"))
+    (-> (h/wait-for #(h/get-by-text "03"))
        (.then #(h/is-truthy (h/query-by-text "/24")))))

  (h/test "text updates on change"
@@ -71,7 +71,9 @@
         [text/text
          {:style (style/char-count blur? theme)
           :size  :paragraph-2}
-          (str (count value))]
+          (pad-0
+           (str
+            (count value)))]
         [text/text
          {:style (style/char-count blur? theme)
           :size  :paragraph-2}
@@ -31,8 +31,7 @@
         :size   :paragraph-2}
        (:name account-props)]
       [address-text/view
-        {:blur?    blur?
-         :networks networks
+        {:networks networks
         :address  (:address account-props)
         :format   :short}]]]
     (when (= action :icon)
@@ -34,8 +34,7 @@

 (def container-info
  {:flex-direction :row
-   :align-items    :center
-   :flex           1})
+   :align-items    :center})

 (def user-info
  {:margin-left 8})
@@ -25,16 +25,14 @@
        :style  {:width 32 :height 32}}]
      [rn/view {:style style/user-info}
       [text/text
-        {:weight          :semi-bold
-         :size            :paragraph-1
-         :number-of-lines 1
-         :style           (style/style-text-name theme)}
+        {:weight :semi-bold
+         :size   :paragraph-1
+         :style  (style/style-text-name theme)}
        (:name dapp)]
       [text/text
-        {:weight          :regular
-         :size            :paragraph-2
-         :number-of-lines 1
-         :style           (style/style-text-value theme)}
+        {:weight :regular
+         :size   :paragraph-2
+         :style  (style/style-text-value theme)}
        (:value dapp)]]]
     (when right-component
       [right-component dapp])]))
@@ -44,14 +44,13 @@
      [:label :string]
      [:fiat-value :string]
      [:token-value :string]
-      [:container-style {:optional true} [:maybe :map]]
      [:customization-color {:optional true} [:maybe :schema.common/customization-color]]
      [:state {:optional true} [:enum :pressed :active :disabled :default]]
      [:on-press {:optional true} [:maybe fn?]]]]]
   :any])

 (defn- view-internal
-  [{:keys [on-press container-style state customization-color]
+  [{:keys [on-press state customization-color]
    :as   props
    :or   {customization-color :blue}}]
  (let [theme                  (quo.theme/use-theme)
@@ -60,8 +59,7 @@
        on-press-out           (rn/use-callback #(set-pressed false))
        internal-state         (if pressed? :pressed state)]
    [rn/pressable
-     {:style               (merge (style/container internal-state customization-color theme)
-                                  container-style)
+     {:style               (style/container internal-state customization-color theme)
      :on-press-in         (when-not (= state :disabled) on-press-in)
      :on-press-out        (when-not (= state :disabled) on-press-out)
      :on-press            (when-not (= state :disabled) on-press)
@@ -8,7 +8,7 @@
    [quo.foundations.colors :as colors]
    [react-native.core :as rn]))

-(def container
+(def container-style
  {:margin-horizontal  8
   :padding-vertical   8
   :padding-horizontal 12
@@ -43,9 +43,9 @@
 (defn user
  [{:keys [short-chat-key primary-name secondary-name photo-path online? contact? verified?
           untrustworthy? on-press on-long-press accessory customization-color theme
-           allow-multiple-presses? disabled? container-style]}]
+           allow-multiple-presses? disabled?]}]
  [rn/touchable-highlight
-   {:style                   (merge container container-style)
+   {:style                   container-style
    :underlay-color          (colors/resolve-color customization-color theme 5)
    :allow-multiple-presses? allow-multiple-presses?
    :accessibility-label     :user-list
@@ -34,12 +34,6 @@
    (set-state (fn [prev-state]
                 (assoc prev-state :image-loaded? true)))))

-(defn on-load
-  [evt set-state]
-  (let [source       (.. evt -nativeEvent -source)
-        aspect-ratio (/ (.-width source) (.-height source))]
-    (set-state (fn [prev-state] (assoc prev-state :image-aspect-ratio aspect-ratio)))))
-
 (defn on-load-error
  [set-state]
  (js/setTimeout (fn []
@@ -153,7 +147,6 @@
        [reanimated/view {:style (style/supported-file image-opacity)}
         [rn/image
          {:style         style/image
-           :on-load       #(on-load % set-state)
           :on-load-start #(set-load-time (fn [start-time] (- (datetime/now) start-time)))
           :on-load-end   #(on-load-end {:load-time      load-time
                                         :set-state      set-state
@@ -204,7 +197,6 @@
       [reanimated/view {:style (style/supported-file image-opacity)}
        [rn/image
         {:style         style/image
-          :on-load       #(on-load % set-state)
          :on-load-start #(set-load-time (fn [start-time] (- (datetime/now) start-time)))
          :on-load-end   #(on-load-end {:load-time      load-time
                                        :set-state      set-state
@@ -227,13 +219,12 @@
 (defn- view-internal
  [{:keys [container-style type on-press on-long-press supported-file?]
    :as   props}]
-  (let [[state set-state]  (rn/use-state {:image-loaded?      false
-                                          :image-aspect-ratio nil
-                                          :image-error?       false
-                                          :avatar-loaded?     false})
+  (let [[state set-state]  (rn/use-state {:image-loaded?  false
+                                          :image-error?   false
+                                          :avatar-loaded? false})
        collectible-ready? (or (:image-loaded? state) (not supported-file?))]
    [rn/pressable
-     {:on-press            (when collectible-ready? #(on-press (:image-aspect-ratio state)))
+     {:on-press            (when collectible-ready? on-press)
      :on-long-press       (when collectible-ready? on-long-press)
      :accessibility-label :collectible-list-item
      :style               container-style}
@@ -1,70 +1,30 @@
 (ns quo.components.profile.expanded-collectible.style
  (:require [quo.foundations.colors :as colors]))

-(defn container
-  [aspect-ratio]
-  (cond-> {:align-items     :center
-           :justify-content :center
-           :border-radius   16}
-    aspect-ratio (assoc :width        "100%"
-                        :aspect-ratio aspect-ratio)))
+(def container
+  {:align-items     :center
+   :justify-content :center
+   :border-radius   16})

 (defn image
-  [square? aspect-ratio theme]
-  {:width            "100%"
-   :aspect-ratio     (if square? 1 aspect-ratio)
-   :border-radius    16
-   :background-color (colors/theme-colors colors/white colors/neutral-95 theme)})
-
-(defn collectible-border
-  [theme]
-  {:position      :absolute
-   :top           0
-   :left          0
-   :right         0
-   :bottom        0
-   :border-radius 16
-   :border-width  1
-   :border-color  (colors/theme-colors colors/neutral-80-opa-5 colors/white-opa-5 theme)})
+  [square? aspect-ratio]
+  {:width         "100%"
+   :aspect-ratio  (if square? 1 aspect-ratio)
+   :border-radius 16})

 (defn fallback
-  ([theme]
-   (fallback theme 1))
-  ([theme aspect-ratio]
-   {:background-color (colors/theme-colors colors/neutral-2_5 colors/neutral-90 theme)
-    :border-style     :dashed
-    :border-color     (colors/theme-colors colors/neutral-20 colors/neutral-80 theme)
-    :border-width     1
-    :border-radius    16
-    :width            "100%"
-    :aspect-ratio     aspect-ratio
-    :align-items      :center
-    :justify-content  :center}))
+  [{:keys [theme]}]
+  {:background-color (colors/theme-colors colors/neutral-2_5 colors/neutral-90 theme)
+   :border-style     :dashed
+   :border-color     (colors/theme-colors colors/neutral-20 colors/neutral-80 theme)
+   :border-width     1
+   :border-radius    16
+   :width            "100%"
+   :aspect-ratio     1
+   :align-items      :center
+   :justify-content  :center})

 (def counter
  {:position :absolute
   :top      12
   :right    12})
-
-(defn loading-image-with-opacity
-  [opacity]
-  [{:align-items     :center
-    :aspect-ratio    1
-    :border-radius   16
-    :justify-content :center
-    :opacity         opacity
-    :position        :absolute
-    :width           "100%"
-    :z-index         1}])
-
-(defn gradient-view
-  [aspect-ratio]
-  {:border-radius   16
-   :width           "100%"
-   :aspect-ratio    aspect-ratio
-   :align-items     :center
-   :justify-content :center})
-
-(defn supported-file
-  [opacity]
-  {:opacity opacity})
@@ -1,63 +1,29 @@
 (ns quo.components.profile.expanded-collectible.view
  (:require
-    [clojure.string :as string]
+    [promesa.core :as promesa]
    [quo.components.counter.collectible-counter.view :as collectible-counter]
    [quo.components.icon :as icon]
    [quo.components.markdown.text :as text]
    [quo.components.profile.expanded-collectible.style :as style]
    [quo.foundations.colors :as colors]
-    [quo.foundations.gradients :as gradients]
+    [quo.theme]
+    [quo.theme]
    [quo.theme]
    [react-native.core :as rn]
-    [react-native.reanimated :as reanimated]
    [schema.core :as schema]
-    [utils.datetime :as datetime]
    [utils.i18n :as i18n]))

-(def timing-options-out 650)
-(def timing-options-in 1000)
-(def first-load-time 500)
-(def cached-load-time 200)
-(def error-wait-time 800)
-
-(defn on-load-end
-  [{:keys [load-time set-state loader-opacity image-opacity]}]
-  (reanimated/animate loader-opacity 0 timing-options-out)
-  (reanimated/animate image-opacity 1 timing-options-in)
-  (if (> load-time cached-load-time)
-    (js/setTimeout
-     (fn []
-       (set-state (fn [prev-state]
-                    (assoc prev-state :image-loaded? true))))
-     first-load-time)
-    (set-state (fn [prev-state]
-                 (assoc prev-state :image-loaded? true)))))
-
-(defn on-load-error
-  [set-state]
-  (js/setTimeout (fn []
-                   (set-state (fn [prev-state] (assoc prev-state :image-error? true))))
-                 error-wait-time))
-
-(defn- loading-image
-  [{:keys [theme gradient-color-index loader-opacity aspect-ratio]}]
-  [reanimated/view
-   {:style (style/loading-image-with-opacity loader-opacity)}
-   [gradients/view
-    {:theme           theme
-     :container-style (style/gradient-view aspect-ratio)
-     :color-index     gradient-color-index}]])
-
 (defn- counter-view
  [counter]
-  [collectible-counter/view
-   {:container-style style/counter
-    :value           counter}])
+  (when counter
+    [collectible-counter/view
+     {:container-style style/counter
+      :value           counter}]))

 (defn- fallback-view
-  [{:keys [label theme counter on-mount]}]
-  (rn/use-mount on-mount)
-  [rn/view {:style (style/fallback theme)}
+  [{:keys [label theme counter]}]
+  [rn/view
+   {:style (style/fallback {:theme theme})}
   [counter-view counter]
   [rn/view
    [icon/icon :i/sad {:color (colors/theme-colors colors/neutral-40 colors/neutral-50 theme)}]]
@@ -69,67 +35,49 @@

 (defn view-internal
  [{:keys [container-style square? on-press counter image-src native-ID supported-file?
-           on-collectible-load aspect-ratio]}]
-  (let [theme                     (quo.theme/use-theme)
-        loader-opacity            (reanimated/use-shared-value
-                                   (if supported-file? 1 0))
-        image-opacity             (reanimated/use-shared-value
-                                   (if supported-file? 0 1))
-        [load-time set-load-time] (rn/use-state (datetime/now))
-        [state set-state]         (rn/use-state {:image-loaded? false
-                                                 :image-error?  (or (nil? image-src)
-                                                                    (string/blank?
-                                                                     image-src))})]
+           on-collectible-load]}]
+  (let [theme                          (quo.theme/use-theme)
+        [image-size set-image-size]    (rn/use-state {})
+        [image-error? set-image-error] (rn/use-state false)]
+    (rn/use-effect
+     (fn []
+       (promesa/let [[image-width image-height] (rn/image-get-size image-src)]
+         (set-image-size {:width        image-width
+                          :height       image-height
+                          :aspect-ratio (/ image-width image-height)})))
+     [image-src])
    [rn/pressable
-     {:on-press            (when (and (not (:image-error? state)) supported-file?) on-press)
+     {:on-press            (when (and (not image-error?) supported-file?) on-press)
      :accessibility-label :expanded-collectible
-      :style               (merge container-style
-                                  (style/container aspect-ratio))}
+      :style               (merge container-style style/container)}
     (cond
       (not supported-file?)
       [fallback-view
-        {:aspect-ratio aspect-ratio
-         :label        (i18n/label :t/unsupported-file)
-         :counter      counter
-         :theme        theme
-         :on-mount     on-collectible-load}]
+        {:label   (i18n/label :t/unsupported-file)
+         :counter counter
+         :theme   theme}]

-       (:image-error? state)
+       image-error?
       [fallback-view
-        {:label    (i18n/label :t/cant-fetch-info)
-         :counter  counter
-         :theme    theme
-         :on-mount on-collectible-load}]
+        {:label   (i18n/label :t/cant-fetch-info)
+         :counter counter
+         :theme   theme}]

-       (not (:image-loaded? state))
-       [loading-image
-        {:aspect-ratio         aspect-ratio
-         :loader-opacity       loader-opacity
-         :theme                theme
-         :gradient-color-index :gradient-5}])
-     (when supported-file?
-       [reanimated/view {:style (style/supported-file image-opacity)}
+       (and (not image-error?) supported-file?)
+       [rn/view
        [rn/image
-         {:style         (style/image square? aspect-ratio theme)
-          :source        image-src
-          :native-ID     native-ID
-          :on-load-start #(set-load-time (fn [start-time] (- (datetime/now) start-time)))
-          :on-load-end   #(on-load-end {:load-time      load-time
-                                        :set-state      set-state
-                                        :loader-opacity loader-opacity
-                                        :image-opacity  image-opacity})
-          :on-error      #(on-load-error set-state)
-          :on-load       on-collectible-load}]
-        (when counter
-          [counter-view counter])
-        [rn/view {:style (style/collectible-border theme)}]])]))
+         {:style     (style/image square? (:aspect-ratio image-size))
+          :source    image-src
+          :native-ID native-ID
+          :on-error  #(set-image-error true)
+          :on-load   on-collectible-load}]
+        [counter-view counter]])]))

 (def ?schema
  [:=>
   [:catn
    [:props
     [:map {:closed true}
-      [:aspect-ratio {:optional true} [:maybe number?]]
      [:image-src {:optional true} [:maybe string?]]
      [:supported-file? {:optional true} [:maybe boolean?]]
      [:container-style {:optional true} [:maybe :map]]
@@ -12,8 +12,7 @@
  [{:keys [checked? blur? accessibility-label container-style on-change icon customization-color]} label]
  (let [theme (quo.theme/use-theme)]
    [rn/touchable-without-feedback
-     {:on-press            (when on-change
-                             #(on-change (not checked?)))
+     {:on-press            on-change
      :accessibility-label :disclaimer-touchable-opacity}
     [rn/view {:style (merge container-style (style/container blur? theme))}
      [selectors/view
@@ -31,7 +31,7 @@
 (defn- checkbox-border-unchecked-color
  [theme]
  {:normal (colors/theme-colors colors/neutral-30 colors/neutral-70 theme)
-   :blur   (colors/theme-colors colors/neutral-80-opa-20 colors/white-opa-20 theme)})
+   :blur   (colors/theme-colors colors/neutral-80-opa-20 colors/white-opa-40 theme)})

 (defn- filled-checkbox-background-color
  [theme]
@@ -51,24 +51,3 @@
                             :right-icon :i/globe
                             :chevron?   true}]}])
    (h/is-truthy (h/get-by-text "subtitle"))))
-
-(h/describe "Data Item Category tests"
-  (h/test "category renders"
-    (h/render [category/category
-               {:list-type :data-item
-                :label     "Label"
-                :data      [{:title      "Item 1"
-                             :subtitle   "subtitle"
-                             :right-icon :i/globe}]}])
-    (h/is-truthy (h/get-by-text "Label"))
-    (h/is-truthy (h/get-by-text "Item 1"))
-    (h/is-truthy (h/get-by-text "subtitle")))
-
-  (h/test "category renders without label"
-    (h/render [category/category
-               {:list-type :data-item
-                :data      [{:title      "Item 1"
-                             :subtitle   "subtitle"
-                             :right-icon :i/globe}]}])
-    (h/is-falsy (h/query-by-label-text "Label"))
-    (h/is-truthy (h/get-by-text "Item 1"))))
@@ -1,32 +0,0 @@
-(ns quo.components.settings.category.data-item.view
-  (:require
-    [quo.components.markdown.text :as text]
-    [quo.components.settings.category.style :as style]
-    [quo.components.settings.data-item.view :as data-item]
-    [quo.theme :as quo.theme]
-    [react-native.core :as rn]))
-
-(defn view
-  [{:keys [label data container-style blur?]}]
-  (let [theme     (quo.theme/use-theme)
-        last-item (rn/use-memo #(last data) [data])]
-    [rn/view {:style (merge (style/container label) container-style)}
-     (when label
-       [text/text
-        {:weight :medium
-         :size   :paragraph-2
-         :style  (style/label blur? theme)}
-        label])
-     [rn/view {:style (style/settings-items blur? theme)}
-      (for [item data
-            ;; NOTE: overwriting the background of the data-item in favor of the category bg
-            :let [data-item-container-style (-> item :container-style (assoc :background-color nil))
-                  data-item-props           (assoc item
-                                                   :blur?           blur?
-                                                   :container-style data-item-container-style)]]
-        ^{:key item}
-        [:<>
-         [data-item/view data-item-props]
-         (when-not (= item last-item)
-           [rn/view {:style (style/settings-separator blur? theme)}])])]]))
-
@@ -7,23 +7,20 @@
    [react-native.core :as rn]))

 (defn settings-category
-  [{:keys [label data blur? container-style]}]
-  (let [theme          (quo.theme/use-theme)
-        settings-items (remove nil? data)
-        last-index     (dec (count settings-items))]
+  [{:keys [label data container-style] :as props}]
+  (let [theme         (quo.theme/use-theme)
+        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 blur? theme)}
+         :style  (style/label props theme)}
        label])
-     [rn/view {:style (style/settings-items blur? theme)}
-      (map-indexed
-       (fn [index item]
-         ^{:key (str label (:title item))}
-         [:<>
-          [settings-item/view item]
-          (when-not (= last-index index)
-            [rn/view {:style (style/settings-separator blur? theme)}])])
-       settings-items)]]))
+     [rn/view {:style (style/settings-items props theme)}
+      (for [item settings-item]
+        ^{:key item}
+        [:<>
+         [settings-item/view item]
+         (when-not (= item (last settings-item))
+           [rn/view {:style (style/settings-separator props theme)}])])]]))
@@ -11,7 +11,7 @@
   :padding-bottom     8})

 (defn settings-items
-  [blur? theme]
+  [{:keys [blur?]} theme]
  {:border-radius    16
   :background-color (if blur?
                       colors/white-opa-5
@@ -22,7 +22,7 @@
                       (colors/theme-colors colors/neutral-10 colors/neutral-80 theme))})

 (defn label
-  [blur? theme]
+  [{:keys [blur?]} theme]
  {:margin-bottom 12
   :color         (if blur?
                    colors/white-opa-40
@@ -32,7 +32,7 @@
  {:margin-top 12})

 (defn settings-separator
-  [blur? theme]
+  [{:keys [blur?]} theme]
  {:height           1
   :background-color (if blur?
                       colors/white-opa-5
@@ -1,13 +1,10 @@
 (ns quo.components.settings.category.view
  (:require
-    [quo.components.settings.category.data-item.view :as data-item]
    [quo.components.settings.category.reorder.view :as reorder]
    [quo.components.settings.category.settings.view :as settings]))

 (defn category
  [{:keys [list-type] :as props}]
-  (condp = list-type
-    :settings  [settings/settings-category props]
-    :data-item [data-item/view props]
-    :reorder   [reorder/reorder-category props]
-    nil))
+  (if (= list-type :settings)
+    [settings/settings-category props]
+    [reorder/reorder-category props]))
@@ -10,7 +10,9 @@
    (h/render [quo/data-item
               {:on-press            (h/mock-fn)
                :blur?               false
+                :icon-right?         false
                :card?               true
+                :label               :none
                :status              :default
                :size                :default
                :title               "Label"
@@ -25,7 +27,9 @@
    (h/render [quo/data-item
               {:on-press            (h/mock-fn)
                :blur?               false
+                :icon-right?         false
                :card?               false
+                :label               :none
                :status              :default
                :size                :default
                :title               "Label"
@@ -41,7 +45,9 @@
    (h/render [quo/data-item
               {:on-press            (h/mock-fn)
                :blur?               false
+                :icon-right?         false
                :card?               true
+                :label               :none
                :status              :default
                :size                :small
                :title               "Label"
@@ -57,7 +63,9 @@
    (h/render [quo/data-item
               {:on-press            (h/mock-fn)
                :blur?               false
+                :icon-right?         false
                :card?               true
+                :label               :none
                :status              :default
                :size                :default
                :title               "Label"
@@ -73,7 +81,9 @@
    (h/render [quo/data-item
               {:on-press            (h/mock-fn)
                :blur?               false
+                :icon-right?         false
                :card?               true
+                :label               :none
                :status              :default
                :size                :default
                :title               "Label"
@@ -88,7 +98,9 @@
    (h/render [quo/data-item
               {:on-press            (h/mock-fn)
                :blur?               false
+                :icon-right?         false
                :card?               true
+                :label               :none
                :status              :default
                :size                :default
                :title               "Label"
@@ -103,8 +115,10 @@
    (h/render [quo/data-item
               {:on-press            (h/mock-fn)
                :blur?               false
+                :icon-right?         true
                :right-icon          :i/chevron-right
                :card?               true
+                :label               :none
                :status              :default
                :size                :default
                :title               "Label"
@@ -119,7 +133,10 @@
    (h/render [quo/data-item
               {:on-press            (h/mock-fn)
                :blur?               false
+                :icon-right?         true
+                :right-icon          :i/chevron-right
                :card?               true
+                :label               :preview
                :status              :default
                :size                :default
                :title               "Label"
@@ -134,7 +151,10 @@
    (h/render [quo/data-item
               {:on-press            (h/mock-fn)
                :blur?               false
+                :icon-right?         true
+                :right-icon          :i/chevron-right
                :card?               true
+                :label               :preview
                :status              :default
                :size                :default
                :title               "Label"
@@ -150,7 +170,10 @@
    (h/render [quo/data-item
               {:on-press            (h/mock-fn)
                :blur?               false
+                :icon-right?         true
+                :right-icon          :i/chevron-right
                :card?               true
+                :label               :preview
                :status              :default
                :size                :default
                :title               "Label"
@@ -6,14 +6,8 @@
  [{:keys [size card? blur? actionable? theme]}]
  {:flex-direction     :row
   :justify-content    :space-between
-   :padding-vertical   (case size
-                         :default 8
-                         :large   12
-                         nil)
-   :padding-horizontal (case size
-                         :default 12
-                         :large   16
-                         nil)
+   :padding-vertical   (when (= size :default) 8)
+   :padding-horizontal (when (= size :default) 12)
   :border-radius      16
   :border-width       (when (and card? (not= size :small)) 1)
   :background-color   (if blur?
@@ -30,27 +24,15 @@

 (defn loading-container
  [size blur? theme]
-  {:width            (case size
-                       :large 132
-                       :small 72
-                       132)
-   :height           (case size
-                       :large 16
-                       :small 10
-                       16)
+  {:width            (if (= size :default) 132 72)
+   :height           (if (= size :default) 16 10)
   :background-color (if blur?
                       colors/white-opa-5
                       (colors/theme-colors colors/neutral-5
                                            colors/neutral-90
                                            theme))
-   :border-radius    (case size
-                       :large 6
-                       :small 3
-                       6)
-   :margin-vertical  (case size
-                       :large 4
-                       :small 3
-                       4)})
+   :border-radius    (if (= size :default) 6 3)
+   :margin-vertical  (if (= size :default) 4 3)})

 (def subtitle-container
  {:flex-direction :row
@@ -89,8 +71,9 @@
            (colors/theme-colors colors/neutral-100
                                 colors/white
                                 theme))})
-(def right-icon
-  {:margin-left 12})
+(defn right-icon
+  [label]
+  {:margin-left (if (or (= label :graph) (= label :none)) 12 8)})

 (def left-side
  {:flex 1})
@@ -1,13 +1,15 @@
 (ns quo.components.settings.data-item.view
  (:require
    [quo.components.avatars.account-avatar.view :as account-avatar]
+    [quo.components.common.not-implemented.view :as not-implemented]
    [quo.components.icon :as icons]
    [quo.components.list-items.preview-list.view :as preview-list]
    [quo.components.markdown.text :as text]
    [quo.components.settings.data-item.style :as style]
    [quo.foundations.colors :as colors]
    [quo.theme :as quo.theme]
-    [react-native.core :as rn]))
+    [react-native.core :as rn]
+    [utils.i18n :as i18n]))

 (defn- left-loading
  [{:keys [size blur?]}]
@@ -43,24 +45,32 @@
      subtitle]]))

 (defn- left-title
-  [{:keys [title blur?]}]
+  [{:keys [title label size blur?]}]
  (let [theme (quo.theme/use-theme)]
    [rn/view {:style style/title-container}
     [text/text
      {:weight :regular
       :size   :paragraph-2
       :style  (style/title blur? theme)}
-      title]]))
+      title]
+     (when (and (= :graph label) (not= :small size))
+       [text/text
+        {:weight :regular
+         :size   :label
+         :style  (style/title blur? theme)}
+        (i18n/label :t/days)])]))

 (defn- left-side
  "The description can either be given as a string `subtitle-type` or a component `custom-subtitle`"
-  [{:keys [title status size blur? custom-subtitle icon subtitle subtitle-type icon-color
+  [{:keys [title status size blur? custom-subtitle icon subtitle subtitle-type label icon-color
           customization-color network-image emoji]
    :as   props}]
  (let [theme (quo.theme/use-theme)]
    [rn/view {:style style/left-side}
     [left-title
      {:title title
+       :label label
+       :size  size
       :blur? blur?
       :theme theme}]
     (if (= status :loading)
@@ -83,43 +93,49 @@
           :network-image       network-image}]))]))

 (defn- right-side
-  [{:keys [right-icon right-content icon-color]}]
-  (let [{:keys [type data size]
-         :or   {size :size-24}} right-content]
-    [rn/view {:style style/right-container}
-     (when type
-       [preview-list/view
-        {:type   type
-         :number (count data)
-         :size   size}
-        data])
-     (when right-icon
-       [rn/view {:style style/right-icon}
-        [icons/icon right-icon
-         {:accessibility-label :icon-right
-          :color               icon-color
-          :size                20}]])]))
+  [{:keys [label icon-right? right-icon icon-color communities-list]}]
+  [rn/view {:style style/right-container}
+   (case label
+     :preview [preview-list/view
+               {:type   :communities
+                :number 3
+                :size   :size-24}
+               communities-list]
+     :graph   [text/text "graph"]
+     :none    nil
+     nil)
+   (when icon-right?
+     [rn/view {:style (style/right-icon label)}
+      [icons/icon right-icon
+       {:accessibility-label :icon-right
+        :color               icon-color
+        :size                20}]])])

 (defn view
-  [{:keys [blur? card? right-icon right-content status size on-press container-style]
+  [{:keys [blur? card? icon-right? right-icon label status size on-press communities-list
+           container-style]
    :as   props}]
  (let [theme      (quo.theme/use-theme)
        icon-color (if (or blur? (= :dark theme))
                     colors/neutral-40
                     colors/neutral-50)]
-    [rn/pressable
-     {:accessibility-label :data-item
-      :disabled            (not right-icon)
-      :on-press            on-press
-      :style               (merge (style/container {:size        size
-                                                    :card?       card?
-                                                    :blur?       blur?
-                                                    :actionable? on-press
-                                                    :theme       theme})
-                                  container-style)}
-     [left-side props]
-     (when (and (= :default status) (not= :small size))
-       [right-side
-        {:right-icon    right-icon
-         :right-content right-content
-         :icon-color    icon-color}])]))
+    (if (= :graph label)
+      [not-implemented/view {:blur? blur?}]
+      [rn/pressable
+       {:accessibility-label :data-item
+        :disabled            (not icon-right?)
+        :on-press            on-press
+        :style               (merge (style/container {:size        size
+                                                      :card?       card?
+                                                      :blur?       blur?
+                                                      :actionable? on-press
+                                                      :theme       theme})
+                                    container-style)}
+       [left-side props]
+       (when (and (= :default status) (not= :small size))
+         [right-side
+          {:label            label
+           :icon-right?      icon-right?
+           :right-icon       right-icon
+           :icon-color       icon-color
+           :communities-list communities-list}])])))
@@ -116,8 +116,7 @@
    [rn/view {:style (style/left-container (:image props))}
     [text/text
      {:weight :medium
-       :style  {:color (when blur? colors/white)}}
-      title]
+       :style  {:color (when blur? colors/white)}} title]
     [description-component props]
     [tag-component props]]]
   [rn/view {:style (style/sub-container (:alignment action-props))}
@@ -39,12 +39,6 @@
 (def avatar-container-rounded
  (assoc avatar-container-common :border-radius 16))

-(def big-avatar-container-rounded
-  (assoc avatar-container-common
-         :width         84
-         :height        84
-         :border-radius 42))
-
 (def community-logo-image
  {:width         64
   :height        64
@@ -13,9 +13,8 @@
    :as         props}]
  [rn/view {:style style/avatar-overlay}
   [rn/view
-    {:style (case avatar-type
-              :wallet-account style/avatar-container-rounded
-              :saved-address  style/big-avatar-container-rounded
+    {:style (if (= avatar-type :wallet-account)
+              style/avatar-container-rounded
              style/avatar-container-circular)}
    (case avatar-type
      :profile
@@ -38,7 +37,7 @@
      [channel-avatar/view (assoc props :locked? nil :size :size-64)]

      :saved-address
-      [wallet-avatar/wallet-user-avatar (assoc props :size :size-80)]
+      [wallet-avatar/wallet-user-avatar (assoc props :size :size-64)]

      nil)]])

@@ -28,10 +28,5 @@
   :height        24
   :border-radius 12})

-(def dapp
-  {:width         24
-   :height        24
-   :border-radius 12})
-
 (def token-image
  {:border-radius 12})
@@ -23,10 +23,6 @@
    [rn/image
     {:source image-source
      :style  style/network}]
-    :dapp
-    [rn/image
-     {:source image-source
-      :style  style/dapp}]
    :saved-address
    [wallet-user-avatar/wallet-user-avatar
     {:full-name           label
@@ -54,7 +50,7 @@
    - :label - string - tag label
    - :customization-color - color - It will be passed down to components that
      should vary based on a custom color.
-    - :type - :token / :user / :collectible / :saved-address / :network / :account / :dapp
+    - :type - :token / :user / :collectible / :saved-address / :network / :account
    - :emoji - string - emoji used for displaying account avatar
    - :image-source - resource - image to display on :network, :collectible and :user
    - :theme - :light / :dark"
@@ -70,8 +70,7 @@
                            (colors/theme-colors colors/neutral-10 colors/neutral-80 theme))}))

 (def search-input-container
-  {:flex              0
-   :margin-top        8
+  {:margin-top        8
   :margin-bottom     12
   :margin-horizontal 20})

@@ -7,14 +7,14 @@
  [{:keys [blur? customization-color theme selected? container-style]}]
  (merge {:border-radius  16
          :border-width   1
-          :padding-bottom 8
-          :border-color   (cond
-                            (and selected? blur?) colors/white
-                            selected?             (colors/resolve-color customization-color theme)
-                            blur?                 colors/white-opa-5
-                            :else                 (colors/theme-colors colors/neutral-10
-                                                                       colors/neutral-80
-                                                                       theme))}
+          :border-color   (if selected?
+                            (if blur?
+                              colors/white
+                              (colors/resolve-color customization-color theme))
+                            (if blur?
+                              colors/white-opa-5
+                              (colors/theme-colors colors/neutral-10 colors/neutral-80 theme)))
+          :padding-bottom 8}
         container-style))

 (def header-container
@@ -47,13 +47,12 @@
      :accessibility-label :title}
     [text/text {:weight :semi-bold}
      (if (= type :default-keypair) (keypair-string full-name) full-name)]
-     (case action
-       :none     nil
-       :selector [selectors/view
-                  {:type                :radio
-                   :checked?            selected?
-                   :blur?               blur?
-                   :customization-color customization-color}]
+     (if (= action :selector)
+       [selectors/view
+        {:type                :radio
+         :checked?            selected?
+         :blur?               blur?
+         :customization-color customization-color}]
       [rn/pressable {:on-press on-options-press}
        [icon/icon :i/options
         {:color               (if blur?
@@ -95,23 +94,20 @@

 (defn view
  [{:keys [accounts action container-style selected? on-press] :as props}]
-  (let [theme (quo.theme/use-theme)]
-    [rn/pressable
-     {:style          (style/container (assoc props
-                                              :selected?       selected?
-                                              :container-style container-style
-                                              :theme           theme))
-      :on-press       #(when (= action :selector) (on-press))
-      :pointer-events (when (= action :selector) :box-only)}
-     [rn/view {:style style/header-container}
-      [avatar props]
-      [rn/view
-       {:style {:margin-left 8
-                :flex        1}}
-       [title-view (assoc props :selected? selected?)]
-       [details-view props]]]
-     [rn/flat-list
-      {:data      accounts
-       :render-fn acc-list-card
-       :separator [rn/view {:style {:height 8}}]
-       :style     {:padding-horizontal 8}}]]))
+  [rn/pressable
+   {:style    (style/container (merge props
+                                      {:selected?       selected?
+                                       :container-style container-style}))
+    :on-press #(when (= action :selector) (on-press))}
+   [rn/view {:style style/header-container}
+    [avatar props]
+    [rn/view
+     {:style {:margin-left 8
+              :flex        1}}
+     [title-view (assoc props :selected? selected?)]
+     [details-view props]]]
+   [rn/flat-list
+    {:data      accounts
+     :render-fn acc-list-card
+     :separator [rn/view {:style {:height 8}}]
+     :style     {:padding-horizontal 8}}]])
@@ -11,7 +11,7 @@
    [utils.i18n :as i18n]))

 (defn title-view
-  [{:keys [keypairs blur? on-import-press show-import-all?]}]
+  [{:keys [keypairs blur? on-import-press]}]
  (let [theme (quo.theme/use-theme)]
    [rn/view
     {:accessibility-label :title
@@ -29,13 +29,12 @@
         :style  {:color colors/warning-60}}
        (i18n/label :t/amount-missing-keypairs
                    {:amount (str (count keypairs))})]
-       (when show-import-all?
-         [button/button
-          {:type       :outline
-           :background :blur
-           :size       24
-           :on-press   on-import-press}
-          (i18n/label :t/import)])]
+       [button/button
+        {:type       :outline
+         :background :blur
+         :size       24
+         :on-press   on-import-press}
+        (i18n/label :t/import)]]
      [text/text
       {:size  :paragraph-2
        :style (style/subtitle blur? theme)}
@@ -31,7 +31,7 @@
        :else                 (string/capitalize (name network))))

 (defn view-internal
-  [{:keys [network status amount container-style on-press on-long-press] :as args}]
+  [{:keys [network status amount container-style on-press] :as args}]
  (let [theme (quo.theme/use-theme)]
    (if (= status :edit)
      [network-bridge-add (assoc args :theme theme)]
@@ -39,8 +39,7 @@
       {:style               (merge (style/container network status theme) container-style)
        :accessible          true
        :accessibility-label :container
-        :on-press            on-press
-        :on-long-press       on-long-press}
+        :on-press            on-press}
       (if (= status :loading)
         [rn/view
          {:style               (style/loading-skeleton theme)
@@ -81,9 +81,8 @@
                                        (js->clj :keywordize-keys true)
                                        (on-selection-change))))]
    (fn [{:keys [token customization-color show-keyboard? crypto? currency value error? selection
-                 handle-on-swap allow-selection?]
-          :or   {show-keyboard?   true
-                 allow-selection? true}}]
+                 handle-on-swap]
+          :or   {show-keyboard? true}}]
      (let [theme        (quo.theme/use-theme)
            window-width (:width (rn/get-window))]
        [rn/pressable
@@ -108,8 +107,7 @@
                     :selection-color          customization-color
                     :show-soft-input-on-focus show-keyboard?
                     :on-selection-change      handle-selection-change
-                     :selection                (clj->js selection)
-                     :editable                 allow-selection?}
+                     :selection                (clj->js selection)}
              controlled-input?       (assoc :value value)
              (not controlled-input?) (assoc :default-value value-internal))]
           [token-name-text theme (if crypto? token currency)]]]
@@ -46,10 +46,9 @@
  [rn/view
   {:style style/transaction-header-container}
   [text/text
-    {:weight              :semi-bold
-     :size                :paragraph-1
-     :style               (style/transaction-header theme)
-     :accessibility-label :transaction-header}
+    {:weight :semi-bold
+     :size   :paragraph-1
+     :style  (style/transaction-header theme)}
    (transaction transaction-translation)]
   (when (> counter 1)
     [rn/view (style/transaction-counter-container theme blur?)
@@ -60,10 +59,9 @@
       (i18n/label :t/x-counter {:counter counter})]])
   [rn/view {:style style/timestamp-container}
    [text/text
-     {:weight              :regular
-      :size                :label
-      :style               (style/timestamp theme blur?)
-      :accessibility-label :transaction-timestamp}
+     {:weight :regular
+      :size   :label
+      :style  (style/timestamp theme blur?)}
     timestamp]]])

 (defn transaction-icon-view
@@ -2,13 +2,12 @@
  (:require
    [quo.foundations.colors :as colors]))

-(defn container-info
-  [{:keys [metrics]}]
+(def container-info
  {:padding-horizontal 20
   :padding-top        12
   :padding-bottom     32
   :flex-grow          1
-   :height             (if (= metrics :none) 78 98)})
+   :max-height         98})

 (def container-info-top
  {:flex-direction  :row
@@ -116,7 +116,7 @@

 (defn- view-internal
  [props]
-  [rn/view {:style (style/container-info props)}
+  [rn/view {:style style/container-info}
   [view-info-top props]
   [view-info-bottom props]])

@@ -68,7 +68,7 @@
    quo.components.graph.wallet-graph.view
    quo.components.header
    quo.components.icon
-    quo.components.info.info-message.view
+    quo.components.info.info-message
    quo.components.info.information-box.view
    quo.components.inputs.address-input.view
    quo.components.inputs.input.view
@@ -301,7 +301,7 @@
 (def icon quo.components.icon/icon)

 ;;;; Info
-(def info-message quo.components.info.info-message.view/view)
+(def info-message quo.components.info.info-message/info-message)
 (def information-box quo.components.info.information-box.view/view)

 ;;;; Inputs
@@ -41,7 +41,6 @@
    quo.components.dropdowns.network-dropdown.component-spec
    quo.components.gradient.gradient-cover.component-spec
    quo.components.graph.wallet-graph.component-spec
-    quo.components.info.info-message.component-spec
    quo.components.inputs.address-input.component-spec
    quo.components.inputs.input.component-spec
    quo.components.inputs.locked-input.component-spec
@@ -151,7 +151,7 @@
 (def black-opa-0 (alpha black 0))
 (def black-opa-30 (alpha black 0.3))
 (def black-opa-60 (alpha black 0.6))
-(def onboarding-header-black neutral-100)
+(def onboarding-header-black "#000716")
 (def border-avatar-light
  "Simulates a blurred, transparent border for avatars in light mode"
  "#475060")
@@ -33,9 +33,6 @@
  [:fn {:error/message "schema.common/exception should be of type ExceptionInfo"}
   (fn [v] (instance? ExceptionInfo v))])

-(def ^:private ?hiccup
-  vector?)
-
 (defn register-schemas
  []
  (registry/register ::theme ?theme)
@@ -43,5 +40,4 @@
  (registry/register ::public-key ?public-key)
  (registry/register ::image-source ?image-source)
  (registry/register ::rpc-call ?rpc-call)
-  (registry/register ::exception ?exception)
-  (registry/register ::hiccup ?hiccup))
+  (registry/register ::exception ?exception))
@@ -11,10 +11,9 @@
 (defn get-label-by-type
  [biometric-type]
  (condp = biometric-type
-    constants/biometrics-type-android  (i18n/label :t/biometric-fingerprint)
-    constants/biometrics-type-face-id  (i18n/label :t/biometric-faceid)
-    constants/biometrics-type-touch-id (i18n/label :t/biometric-touchid)
-    (i18n/label :t/biometric)))
+    constants/biometrics-type-android (i18n/label :t/biometric-fingerprint)
+    constants/biometrics-type-face-id (i18n/label :t/biometric-faceid)
+    (i18n/label :t/biometric-touchid)))

 (defn get-icon-by-type
  [biometric-type]
@@ -1,6 +1,7 @@
 (ns status-im.common.bottom-sheet.style
  (:require
-    [quo.foundations.colors :as colors]))
+    [quo.foundations.colors :as colors]
+    [react-native.platform :as platform]))

 (def ^:private sheet-border-radius 20)

@@ -21,8 +22,11 @@
   :left     0
   :right    0})

-(def shell-bg
-  {:background-color colors/bottom-sheet-background-blur
+(defn shell-bg
+  [blur-background]
+  {:background-color (if blur-background
+                       blur-background
+                       (if platform/ios? colors/white-opa-5 colors/neutral-100-opa-90))
   :flex             1})

 (def shell-bg-container
@@ -63,7 +63,7 @@
 (defn view
  [{:keys [hide? insets]}
   {:keys [content selected-item padding-bottom-override border-radius on-close shell?
-           gradient-cover? customization-color hide-handle? blur-radius]
+           gradient-cover? customization-color hide-handle? blur-radius blur-background]
    :or   {border-radius 12}}]
  (let [theme                             (quo.theme/use-theme)
        {window-height :height}           (rn/get-window)
@@ -134,7 +134,7 @@
       (when shell?
         [rn/view {:style style/shell-bg-container}
          [quo/blur
-           {:style         style/shell-bg
+           {:style         (style/shell-bg blur-background)
            :blur-radius   (or blur-radius 20)
            :blur-amount   32
            :blur-type     :transparent
@@ -1,24 +0,0 @@
-(ns status-im.common.check-before-syncing.style)
-
-(def buttons-container
-  {:flex-direction   :row
-   :justify-content  :space-between
-   :gap              12
-   :padding-vertical 12})
-
-(def button {:flex 1})
-
-(def checkbox
-  {:margin-top     16
-   :flex-direction :row
-   :align-items    :center})
-
-(def checkbox-text {:margin-left 10})
-
-(def checkboxes-container {:margin-bottom 10 :padding-right 10})
-
-(def header {:margin-bottom 8})
-
-(def description {:margin-right -33})
-
-(def view-container {:padding-horizontal 33})
@@ -1,74 +0,0 @@
-(ns status-im.common.check-before-syncing.view
-  (:require
-    [quo.core :as quo]
-    [react-native.core :as rn]
-    [status-im.common.check-before-syncing.style :as style]
-    [utils.i18n :as i18n]
-    [utils.re-frame :as rf]))
-
-(def checks
-  [(i18n/label :t/check-before-syncing-doc-checkbox-1)
-   (i18n/label :t/check-before-syncing-doc-checkbox-2)
-   (i18n/label :t/check-before-syncing-doc-checkbox-3)])
-
-(defn- checkbox
-  [on-change customization-color description]
-  [rn/view {:style style/checkbox}
-   [quo/selectors
-    {:type                :checkbox
-     :blur?               true
-     :customization-color customization-color
-     :on-change           on-change}]
-   [quo/text {:style style/checkbox-text} description]])
-
-(defn- compute-new-checked-count
-  [set-checked-count checked?]
-  (if checked?
-    (set-checked-count inc)
-    (set-checked-count dec)))
-
-(defn- hide-bottom-sheet
-  []
-  (rf/dispatch [:hide-bottom-sheet]))
-
-(defn view
-  [{:keys [on-submit customization-color]}]
-  (let [[checked-count set-checked-count] (rn/use-state 0)
-        on-change                         (partial compute-new-checked-count set-checked-count)
-        render-checkbox                   (rn/use-callback
-                                           (partial checkbox on-change customization-color)
-                                           [customization-color])
-        on-cancel                         hide-bottom-sheet
-        on-continue                       (rn/use-callback
-                                           (fn []
-                                             (hide-bottom-sheet)
-                                             (on-submit))
-                                           [on-submit])]
-    [rn/view
-     {:style               style/view-container
-      :accessibility-label :check-before-syncing-bottom-sheet}
-     [quo/text
-      {:weight :semi-bold
-       :size   :heading-2
-       :style  style/header} (i18n/label :t/check-before-syncing)]
-     [quo/text {:style style/description} (i18n/label :t/check-before-syncing-doc-description)]
-
-     (into
-      [rn/view {:style style/checkboxes-container}]
-      (mapv render-checkbox checks))
-
-     [rn/view {:style style/buttons-container}
-      [quo/button
-       {:type                :grey
-        :container-style     style/button
-        :accessibility-label :cancel-button
-        :on-press            on-cancel}
-       (i18n/label :t/cancel)]
-      [quo/button
-       {:container-style     style/button
-        :disabled?           (not= checked-count (count checks))
-        :customization-color (or customization-color :blue)
-        :accessibility-label :continue-button
-
-        :on-press            on-continue}
-       (i18n/label :t/continue)]]]))
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Prem Chaitanya Prathi	59896858d0	chore: merge branch 'develop' into status-go/filter-improvements	2024-06-13 18:46:09 +05:30
Prem Chaitanya Prathi	31c55b2a8e	chore: disabled px to only use fleet nodes	2024-06-13 18:45:39 +05:30
Prem Chaitanya Prathi	08ee3b7646	Merge branch 'develop' into status-go/filter-improvements	2024-06-12 18:24:20 +05:30
Prem Chaitanya Prathi	98397c5bdc	chore: additional fix for filter subs	2024-06-12 18:21:59 +05:30
Prem Chaitanya Prathi	2451240341	chore: take latest status-go that has fixes for filter subscription	2024-06-11 16:46:47 +05:30
Prem Chaitanya Prathi	39065ff67a	merge remote-tracking branch 'origin' into status-go/filter-improvements	2024-06-11 16:45:45 +05:30
Prem Chaitanya Prathi	4a0c171257	Merge branch 'develop' into status-go/filter-improvements	2024-06-11 15:59:51 +05:30
Prem Chaitanya Prathi	2b2333fdf3	chore: take latest status-go that has fixes for filter subscription	2024-06-11 15:57:07 +05:30
Prem Chaitanya Prathi	7f2cb54d09	Merge remote-tracking branch 'origin' into status-go/filter-improvements	2024-06-11 15:35:38 +05:30
Prem Chaitanya Prathi	e9a6b4e60e	chore: bump status-go version	2024-06-07 16:58:15 +05:30
Prem Chaitanya Prathi	a3b4238bd1	chore: enable lightClient by default	2024-06-07 11:58:11 +05:30
Prem Chaitanya Prathi	be698fb29c	chore: bump status-go with filter improvements	2024-06-06 11:17:52 +05:30