Merge branch 'develop' into dapp-list

Makefile

@@ -333,14 +333,17 @@ shadow-server: export TARGET := clojure
 shadow-server:##@ Start shadow-cljs in server mode for watching
 	yarn shadow-cljs server
 
-_test-clojure: export TARGET := default
+_test-clojure: export TARGET := clojure
 _test-clojure: export WATCH ?= false
+_test-clojure: status-go-library
 _test-clojure:
 ifeq ($(WATCH), true)
-	yarn install && shadow-cljs compile mocks && \
+	yarn node-pre-gyp rebuild && \
+	yarn shadow-cljs compile mocks && \
 	nodemon --exec "yarn shadow-cljs compile test && node --require ./test-resources/override.js $$SHADOW_OUTPUT_TO" -e cljs
 else
-	yarn install && shadow-cljs compile mocks && \
+	yarn node-pre-gyp rebuild && \
+	yarn shadow-cljs compile mocks && \
 	yarn shadow-cljs compile test && \
 	node --require ./test-resources/override.js "$$SHADOW_OUTPUT_TO"
 endif

android/app/src/debug/AndroidManifest.xml

@@ -3,7 +3,7 @@
           xmlns:tools="http://schemas.android.com/tools">
 
     <!-- These are added by React Native for debug mode, but actually aren't needed in release mode -->
-    <uses-permission tools:node="remove" android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
+    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
     <!-- Remove licensing permission since we don't license our app and it blocks F-Droid submissions. -->
     <uses-permission tools:node="remove" android:name="com.android.vending.CHECK_LICENSE"/>
 

ios/Podfile.lock

@@ -1484,7 +1484,7 @@ SPEC CHECKSUMS:
   FBLazyVector: 56e0e498dbb513b96c40bac6284729ba4e62672d
   FBReactNativeSpec: 146c741a3f40361f6bc13a4ba284678cbedb5881
   fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
-  glog: 36c15c01d70ed395c6e4f3619f98a23ee415b07a
+  glog: 530710e7949eb12c82670bd09e946becf50a3c2a
   hermes-engine: 1d1835b2cc54c381909d94d1b3c8e0a2f1a94a0e
   HMSegmentedControl: 34c1f54d822d8308e7b24f5d901ec674dfa31352
   Keycard: ac6df4d91525c3c82635ac24d4ddd9a80aca5fc8

src/js/worklets/header_animations.js

@@ -0,0 +1,25 @@
+import {
+  useDerivedValue,
+  interpolate,
+  interpolateColor,
+  Extrapolation,
+  useAnimatedStyle,
+} from 'react-native-reanimated';
+
+const CLAMP_MIN = 0;
+const CLAMP_MAX = 60;
+const BLUR_MIN = 1;
+const BLUR_MAX = 15;
+
+export const useBlurAmount = (sharedValue) =>
+  useDerivedValue(() =>
+    parseInt(interpolate(sharedValue.value, [CLAMP_MIN, CLAMP_MAX], [BLUR_MIN, BLUR_MAX], Extrapolation.CLAMP)),
+  );
+
+export function useLayerOpacity(sharedValue, from, to) {
+  return useAnimatedStyle(() => ({
+    flex: 1,
+    justifyContent: 'flex-end',
+    backgroundColor: interpolateColor(sharedValue.value, [0, 60], [from, to], 'RGB'),
+  }));
+}

src/mocks/js_dependencies.cljs

@@ -438,6 +438,7 @@
     "../src/js/worklets/parallax.js"                   #js {}
     "../src/js/worklets/profile_header.js"             #js {}
     "../src/js/worklets/identifiers_highlighting.js"   #js {}
+    "../src/js/worklets/header_animations.js"          #js {}
     "./fleets.js"                                      default-fleets
     "../translations/ar.json"                          (js/JSON.parse (slurp "./translations/ar.json"))
     "../translations/de.json"                          (js/JSON.parse (slurp "./translations/de.json"))

src/quo/components/community/community_token_gating/component_spec.cljs

@@ -0,0 +1,61 @@
+(ns quo.components.community.community-token-gating.component-spec
+  (:require
+    [quo.core :as quo]
+    [test-helpers.component :as h]))
+
+(h/describe "Community Detail Token Gating Component"
+  (h/test "render with satisfied permissions"
+    (let [mock-on-press-fn      (h/mock-fn)
+          mock-on-press-info-fn (h/mock-fn)]
+      (h/render
+       [quo/community-token-gating
+        {:tokens          [[{:symbol       "ETH"
+                             :sufficient?  true
+                             :collectible? false
+                             :amount       "0.8"
+                             :img-src      nil}]
+                           [{:symbol       "ETH"
+                             :sufficient?  false
+                             :collectible? false
+                             :amount       "1"
+                             :img-src      nil}
+                            {:symbol       "STT"
+                             :sufficient?  false
+                             :collectible? false
+                             :amount       "10"
+                             :img-src      nil}]]
+         :community-color "#FF0000"
+         :role            "Member"
+         :satisfied?      true
+         :on-press        mock-on-press-fn
+         :on-press-info   mock-on-press-info-fn}])
+      (h/is-truthy (h/get-by-translation-text :t/you-eligible-to-join-as {:role "Member"}))
+      (h/is-truthy (h/get-by-text "0.8 ETH"))
+      (h/is-truthy (h/get-by-text "1 ETH"))
+      (h/is-truthy (h/get-by-text "10 STT"))
+      (h/fire-event :press (h/get-by-translation-text :t/request-to-join))
+      (h/was-called mock-on-press-fn)
+      (h/fire-event :press (h/get-by-label-text :community-token-gating-info))
+      (h/was-called mock-on-press-info-fn)))
+
+  (h/test "render with unsatisfied permissions"
+    (let [mock-on-press-fn      (h/mock-fn)
+          mock-on-press-info-fn (h/mock-fn)]
+      (h/render
+       [quo/community-token-gating
+        {:tokens          [[{:symbol       "ETH"
+                             :sufficient?  false
+                             :collectible? false
+                             :amount       "0.8"
+                             :img-src      nil}]]
+         :community-color "#FF0000"
+         :role            "Member"
+         :satisfied?      false
+         :on-press        mock-on-press-fn
+         :on-press-info   mock-on-press-info-fn}])
+      (h/is-truthy (h/get-by-translation-text :t/you-not-eligible-to-join))
+      (h/is-truthy (h/get-by-text "0.8 ETH"))
+      (h/fire-event :press (h/get-by-translation-text :t/request-to-join))
+      (h/was-not-called mock-on-press-fn)
+      (h/fire-event :press (h/get-by-label-text :community-token-gating-info))
+      (h/was-called mock-on-press-info-fn))))

src/quo/components/community/community_token_gating/schema.cljs

@@ -0,0 +1,22 @@
+(ns quo.components.community.community-token-gating.schema)
+
+(def ^:private ?token-schema
+  [:map
+   [:symbol :string]
+   [:sufficient? :boolean]
+   [:collectible? :boolean]
+   [:amount {:optional true} [:maybe :string]]
+   [:img-src {:optional true} [:maybe :schema.common/image-source]]])
+
+(def ?schema
+  [:=>
+   [:catn
+    [:props
+     [:map
+      [:tokens [:sequential [:sequential ?token-schema]]]
+      [:community-color [:or :string :schema.common/customization-color]]
+      [:role {:optional true} [:maybe :string]]
+      [:satisfied? :boolean]
+      [:on-press fn?]
+      [:on-press-info fn?]]]]
+   :any])

src/quo/components/community/community_token_gating/style.cljs

@@ -0,0 +1,47 @@
+(ns quo.components.community.community-token-gating.style
+  (:require [quo.foundations.colors :as colors]))
+
+(defn container
+  [theme]
+  {:padding-bottom  12
+   :padding-top     10
+   :border-width    1
+   :border-color    (colors/theme-colors colors/neutral-20 colors/neutral-80 theme)
+   :border-radius   16
+   :margin-vertical -4})
+
+(def eligibility-row
+  {:flex-direction     :row
+   :padding-horizontal 12
+   :align-items        :center})
+
+(def divider
+  {:height       27
+   :padding-left 12
+   :padding-top  0
+   :align-items  :flex-start})
+
+(def eligibility-label
+  {:flex 1})
+
+(def you-hodl
+  {:padding-horizontal 12
+   :margin-bottom      15})
+
+(def join-button
+  {:padding-horizontal 12
+   :margin-top         8})
+
+(def token-row
+  {:flex-direction     :row
+   :padding-horizontal 12
+   :row-gap            10
+   :column-gap         8
+   :flex-wrap          :wrap
+   :margin-bottom      11})
+
+;; This wrapper prevents layout shifts caused by border effects on
+;; the view's height when the token has a border.
+(def token-wrapper
+  {:height          26
+   :justify-content :center})

src/quo/components/community/community_token_gating/view.cljs

@@ -0,0 +1,89 @@
+(ns quo.components.community.community-token-gating.view
+  (:require [clojure.string :as string]
+            [quo.components.buttons.button.view :as button]
+            [quo.components.community.community-token-gating.schema :as component-schema]
+            [quo.components.community.community-token-gating.style :as style]
+            [quo.components.dividers.divider-label.view :as divider-label]
+            [quo.components.icon :as icon]
+            [quo.components.markdown.text :as text]
+            [quo.components.tags.collectible-tag.view :as collectible-tag]
+            [quo.components.tags.token-tag.view :as token-tag]
+            [quo.foundations.colors :as colors]
+            [quo.theme :as theme]
+            [react-native.core :as rn]
+            [schema.core :as schema]
+            [utils.i18n :as i18n]))
+
+(defn- token-view
+  [{:keys [collectible? img-src amount sufficient?] :as token}]
+  (let [token-symbol (:symbol token)]
+    [rn/view {:style style/token-wrapper}
+     (if collectible?
+       [collectible-tag/view
+        {:collectible-name    token-symbol
+         :size                :size-24
+         :collectible-img-src img-src
+         :options             (when sufficient?
+                                :hold)}]
+       [token-tag/view
+        {:token-symbol  token-symbol
+         :size          :size-24
+         :token-value   amount
+         :token-img-src img-src
+         :options       (when sufficient? :hold)}])]))
+
+(defn- tokens-row
+  [{:keys [theme tokens divider?]}]
+  [:<>
+   [rn/view
+    {:style style/token-row}
+    (map-indexed (fn [token-index token]
+                   ^{:key (str "token-" token-index)}
+                   [token-view token])
+                 tokens)]
+   (when-not divider?
+     [divider-label/view
+      {:container-style style/divider}
+      [text/text
+       {:size  :label
+        :style {:color (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)}}
+       (string/lower-case (i18n/label :t/or))]])])
+
+(defn- view-internal
+  [{:keys [tokens community-color role satisfied? on-press on-press-info]}]
+  (let [theme            (theme/use-theme)
+        last-token-index (dec (count tokens))]
+    [rn/view {:style (style/container theme)}
+     [rn/view {:style style/eligibility-row}
+      [text/text
+       {:size   :paragraph-1
+        :weight :medium
+        :style  style/eligibility-label}
+       (if satisfied?
+         (i18n/label :t/you-eligible-to-join-as {:role role})
+         (i18n/label :t/you-not-eligible-to-join))]
+      [rn/pressable {:on-press on-press-info}
+       [icon/icon :i/info
+        {:color               (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)
+         :accessibility-label :community-token-gating-info}]]]
+     [text/text
+      {:size  :paragraph-2
+       :style style/you-hodl}
+      (i18n/label (if satisfied? :t/you-hodl :t/you-must-hold))]
+     (map-indexed (fn [index tokens-item]
+                    ^{:key (str role "-tokens-" index)}
+                    [tokens-row
+                     {:tokens   tokens-item
+                      :theme    theme
+                      :divider? (= index last-token-index)}])
+                  tokens)
+     [button/button
+      {:on-press            on-press
+       :container-style     style/join-button
+       :accessibility-label :join-community-button
+       :customization-color community-color
+       :disabled?           (not satisfied?)
+       :icon-left           (if satisfied? :i/unlocked :i/locked)}
+      (i18n/label :t/request-to-join)]]))
+
+(def view (schema/instrument #'view-internal component-schema/?schema))

src/quo/components/community/style.cljs

@@ -101,39 +101,6 @@
    :top      8
    :right    8})
 
-(def token-tag-spacing
-  {:padding-top  10
-   :margin-right 8})
-
-(defn token-row
-  [padding?]
-  (merge
-   {:flex-direction :row
-    :flex-wrap      :wrap
-    :align-items    :center}
-   (when padding?
-     {:padding-horizontal 12})))
-
-(defn token-row-or-text
-  [padding? theme]
-  (merge
-   {:padding-top   4
-    :margin-bottom -2
-    :color         (colors/theme-colors
-                    colors/neutral-50
-                    colors/neutral-40
-                    theme)}
-   (when padding?
-     {:padding-left 12})))
-
-(defn token-row-or-border
-  [theme]
-  {:height           1
-   :background-color (colors/theme-colors
-                      colors/neutral-20
-                      colors/neutral-80
-                      theme)})
-
 (defn loading-card
   [width theme]
   (merge