diff --git a/ios/Podfile.lock b/ios/Podfile.lock index 92e75f312d..1cb7f8d7bc 100644 --- a/ios/Podfile.lock +++ b/ios/Podfile.lock @@ -640,7 +640,7 @@ SPEC CHECKSUMS: FBLazyVector: 3bb422f41b18121b71783a905c10e58606f7dc3e FBReactNativeSpec: f2c97f2529dd79c083355182cc158c9f98f4bd6e Folly: b73c3869541e86821df3c387eb0af5f65addfab4 - glog: 36ce0530c6d2c3a5a4326885ef4069564887a1db + glog: 997518ea2aa2d8cd5df9797b641b758d52ecf2bc HMSegmentedControl: 34c1f54d822d8308e7b24f5d901ec674dfa31352 Keycard: ac6df4d91525c3c82635ac24d4ddd9a80aca5fc8 libwebp: 60305b2e989864154bd9be3d772730f08fc6a59c diff --git a/src/quo2/components/avatars/account_avatar.cljs b/src/quo2/components/avatars/account_avatar.cljs index d834d9ad6f..02b2da9c47 100644 --- a/src/quo2/components/avatars/account_avatar.cljs +++ b/src/quo2/components/avatars/account_avatar.cljs @@ -1,8 +1,8 @@ (ns quo2.components.avatars.account-avatar - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [status-im.ui.components.icons.icons :as icons] - [quo.theme :as theme])) + [quo2.theme :as theme])) (def icon-color-value {:dark (get-in colors/customization [:dark :purple]) diff --git a/src/quo2/components/avatars/channel_avatar.cljs b/src/quo2/components/avatars/channel_avatar.cljs index 26b9bf6019..4a63c5781d 100644 --- a/src/quo2/components/avatars/channel_avatar.cljs +++ b/src/quo2/components/avatars/channel_avatar.cljs @@ -1,9 +1,9 @@ (ns quo2.components.avatars.channel-avatar (:require [quo2.foundations.colors :as colors] - [quo.react-native :as rn] + [react-native.core :as rn] [quo2.components.icon :as icons] [quo2.components.markdown.text :as text] - [quo.theme :as theme])) + [quo2.theme :as theme])) (defn channel-avatar [{:keys [big? locked? emoji-background-color emoji]}] (let [lock-exists? (some? locked?) diff --git a/src/quo2/components/avatars/group_avatar.cljs b/src/quo2/components/avatars/group_avatar.cljs index 9c547f98b7..65120a5229 100644 --- a/src/quo2/components/avatars/group_avatar.cljs +++ b/src/quo2/components/avatars/group_avatar.cljs @@ -1,7 +1,7 @@ (ns quo2.components.avatars.group-avatar (:require [quo2.foundations.colors :as colors] [quo2.components.icon :as icon] - [quo.react-native :as rn])) + [react-native.core :as rn])) (def sizes {:icon {:small 12 diff --git a/src/quo2/components/avatars/icon_avatar.cljs b/src/quo2/components/avatars/icon_avatar.cljs index 06ef028360..0b817fbc19 100644 --- a/src/quo2/components/avatars/icon_avatar.cljs +++ b/src/quo2/components/avatars/icon_avatar.cljs @@ -1,5 +1,5 @@ (ns quo2.components.avatars.icon-avatar - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [status-im.ui.components.icons.icons :as icons])) diff --git a/src/quo2/components/avatars/user_avatar.cljs b/src/quo2/components/avatars/user_avatar.cljs index e3f7d24760..9994a1ff45 100644 --- a/src/quo2/components/avatars/user_avatar.cljs +++ b/src/quo2/components/avatars/user_avatar.cljs @@ -1,10 +1,10 @@ (ns quo2.components.avatars.user-avatar - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] [quo2.components.icon :as icons] [clojure.string :refer [upper-case split blank?]] - [quo.theme :refer [dark?]] + [quo2.theme :refer [dark?]] [status-im.ui.components.fast-image :as fast-image])) (def sizes {:big {:outer 80 diff --git a/src/quo2/components/avatars/wallet_user_avatar.cljs b/src/quo2/components/avatars/wallet_user_avatar.cljs index 8b7e9453e1..8b786904c3 100644 --- a/src/quo2/components/avatars/wallet_user_avatar.cljs +++ b/src/quo2/components/avatars/wallet_user_avatar.cljs @@ -1,5 +1,5 @@ (ns quo2.components.avatars.wallet-user-avatar - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [quo2.components.markdown.text :as text] [clojure.string :as clojure-string])) diff --git a/src/quo2/components/buttons/button.cljs b/src/quo2/components/buttons/button.cljs index c6cf1de6a7..4bb4753525 100644 --- a/src/quo2/components/buttons/button.cljs +++ b/src/quo2/components/buttons/button.cljs @@ -1,8 +1,8 @@ (ns quo2.components.buttons.button - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [quo2.components.markdown.text :as text] - [quo.theme :as theme] + [quo2.theme :as theme] [reagent.core :as reagent] [quo2.components.icon :as quo2.icons])) diff --git a/src/quo2/components/buttons/dynamic_button.cljs b/src/quo2/components/buttons/dynamic_button.cljs index 6ed8b1325c..c2072ffc90 100644 --- a/src/quo2/components/buttons/dynamic_button.cljs +++ b/src/quo2/components/buttons/dynamic_button.cljs @@ -1,5 +1,5 @@ (ns quo2.components.buttons.dynamic-button - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [reagent.core :as reagent] [status-im.i18n.i18n :as i18n] [quo2.components.icon :as icon] diff --git a/src/quo2/components/code/snippet.cljs b/src/quo2/components/code/snippet.cljs index 59e914d23d..64ff9573d1 100644 --- a/src/quo2/components/code/snippet.cljs +++ b/src/quo2/components/code/snippet.cljs @@ -4,8 +4,8 @@ [cljs-bean.core :as bean] [clojure.string :as str] [oops.core :as oops] - [quo.react-native :as rn] - [quo.theme :as theme] + [react-native.core :as rn] + [quo2.theme :as theme] [quo2.components.buttons.button :as button] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] diff --git a/src/quo2/components/counter/counter.cljs b/src/quo2/components/counter/counter.cljs index f8999e6a03..27048d7662 100644 --- a/src/quo2/components/counter/counter.cljs +++ b/src/quo2/components/counter/counter.cljs @@ -1,6 +1,6 @@ (ns quo2.components.counter.counter - (:require [quo.theme :as theme] - [quo.react-native :as rn] + (:require [quo2.theme :as theme] + [react-native.core :as rn] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/components/dividers/divider_label.cljs b/src/quo2/components/dividers/divider_label.cljs index d2686d8d06..a35fb5e19d 100644 --- a/src/quo2/components/dividers/divider_label.cljs +++ b/src/quo2/components/dividers/divider_label.cljs @@ -1,5 +1,5 @@ (ns quo2.components.dividers.divider-label - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.components.markdown.text :as markdown.text] [status-im.ui.components.icons.icons :as icons] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/components/dividers/new_messages.cljs b/src/quo2/components/dividers/new_messages.cljs index 9377eb6932..62d46eb488 100644 --- a/src/quo2/components/dividers/new_messages.cljs +++ b/src/quo2/components/dividers/new_messages.cljs @@ -1,18 +1,16 @@ (ns quo2.components.dividers.new-messages - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] - [status-im.i18n.i18n :as i18n] - [status-im.ui.components.react :as react])) + [react-native.linear-gradient :as linear-gradient])) (defn new-messages "new-messages params - label, color" - [{:keys [label color] :or {label (i18n/label :new-messages-header) - color :primary}}] + [{:keys [label color] :or {color :primary}}] (let [bg-color (colors/custom-color-by-theme color 50 60 5 5) text-color (colors/custom-color-by-theme color 50 60)] - [react/linear-gradient {:colors [bg-color "rgba(0,0,0,0)"] - :start {:x 0 :y 0} :end {:x 0 :y 1}} + [linear-gradient/linear-gradient {:colors [bg-color "rgba(0,0,0,0)"] + :start {:x 0 :y 0} :end {:x 0 :y 1}} [rn/view {:style {:padding-left 60 :padding-vertical 12 :padding-right 24}} diff --git a/src/quo2/components/drawers/action_drawers.cljs b/src/quo2/components/drawers/action_drawers.cljs index f94f1e2f08..6185e5af59 100644 --- a/src/quo2/components/drawers/action_drawers.cljs +++ b/src/quo2/components/drawers/action_drawers.cljs @@ -1,6 +1,6 @@ (ns quo2.components.drawers.action-drawers (:require [status-im.ui.components.react :as react] - [quo.react-native :as rn] + [react-native.core :as rn] [quo2.components.markdown.text :as text] [quo2.components.icon :as icon] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/components/dropdowns/dropdown.cljs b/src/quo2/components/dropdowns/dropdown.cljs index 03878872aa..8f89924708 100644 --- a/src/quo2/components/dropdowns/dropdown.cljs +++ b/src/quo2/components/dropdowns/dropdown.cljs @@ -1,9 +1,9 @@ (ns quo2.components.dropdowns.dropdown - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.components.icon :as icons] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] - [quo2.reanimated :as reanimated] + [react-native.reanimated :as reanimated] [reagent.core :as reagent])) (defn apply-anim [dd-height val] diff --git a/src/quo2/components/header.cljs b/src/quo2/components/header.cljs index 9f7e2a3104..084f71c054 100644 --- a/src/quo2/components/header.cljs +++ b/src/quo2/components/header.cljs @@ -1,11 +1,10 @@ (ns quo2.components.header (:require [oops.core :refer [oget]] - [quo.animated :as animated] + [react-native.reanimated :as reanimated] [quo2.components.buttons.button :as button] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] - [quo.design-system.spacing :as spacing] - [quo.react-native :as rn] + [react-native.core :as rn] [reagent.core :as reagent])) (def header-height 56) @@ -61,15 +60,14 @@ :right (max (:width left) (:width right))}))) (def header-actions-style - (merge - {:flex 1 - :flex-direction :row - :align-items :center - :justify-content :center} - (:x-tiny spacing/padding-horizontal))) + {:flex 1 + :flex-direction :row + :align-items :center + :justify-content :center + :padding-horizontal 4}) (def header-action-placeholder - {:width (:base spacing/spacing)}) + {:width 16}) (def element {:align-items :center :justify-content :center @@ -145,9 +143,9 @@ border-bottom false}}] (let [status-bar-height (get insets :top 0) height (+ header-height status-bar-height)] - [animated/view {:style (header-wrapper-style {:height height - :background background - :border-bottom border-bottom})} + [reanimated/view {:style (header-wrapper-style {:height height + :background background + :border-bottom border-bottom})} [rn/view {:pointer-events :box-none :height status-bar-height}] [rn/view {:style (merge {:height header-height} diff --git a/src/quo2/components/info/info_message.cljs b/src/quo2/components/info/info_message.cljs index a534ca8405..e6116f1ddf 100644 --- a/src/quo2/components/info/info_message.cljs +++ b/src/quo2/components/info/info_message.cljs @@ -1,6 +1,6 @@ (ns quo2.components.info.info-message - (:require [quo.theme :as theme] - [quo.react-native :as rn] + (:require [quo2.theme :as theme] + [react-native.core :as rn] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] [quo2.components.icon :as quo2.icons])) diff --git a/src/quo2/components/info/information_box.cljs b/src/quo2/components/info/information_box.cljs index 2ad9b8cf2c..edaa8859a9 100644 --- a/src/quo2/components/info/information_box.cljs +++ b/src/quo2/components/info/information_box.cljs @@ -1,6 +1,6 @@ (ns quo2.components.info.information-box - (:require [quo.theme :as theme] - [quo.react-native :as rn] + (:require [quo2.theme :as theme] + [react-native.core :as rn] [clojure.string :as string] [quo2.foundations.colors :as colors] [quo2.components.icon :as quo2.icons] diff --git a/src/quo2/components/list_items/channel.cljs b/src/quo2/components/list_items/channel.cljs index 62837d6e83..bb9c226399 100644 --- a/src/quo2/components/list_items/channel.cljs +++ b/src/quo2/components/list_items/channel.cljs @@ -1,15 +1,15 @@ (ns quo2.components.list-items.channel - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [quo2.components.counter.counter :as quo2.counter] [quo2.components.icon :as quo2.icons] [quo2.components.avatars.channel-avatar :as channel-avatar] [quo2.components.markdown.text :as quo2.text] - [quo.theme :as theme])) + [quo2.theme :as theme])) (defn list-item [{:keys [name locked? mentions-count unread-messages? muted? is-active-channel? emoji channel-color] - :or {channel-color colors/primary-50}}] + :or {channel-color colors/primary-50}}] [rn/view {:style (merge {:height 48 :display :flex :border-radius 12 @@ -21,21 +21,19 @@ :padding-right 12} (when is-active-channel? {:background-color (colors/theme-alpha channel-color 0.05 0.05)}))} - [rn/view {:display :flex - :flex-direction :row + [rn/view {:display :flex + :flex-direction :row :justify-content :flex-start - :align-items :center} + :align-items :center} [channel-avatar/channel-avatar {:big? true - :locked? locked? + :locked? locked? :emoji-background-color (colors/theme-alpha channel-color 0.1 0.1) :emoji emoji}] [quo2.text/text - {:style (merge {:margin-left 12} - (when - (and (not locked?) - muted?) - {:color (if (theme/dark?) colors/neutral-60 colors/neutral-40)})) + {:style (merge {:margin-left 12} + (when (and (not locked?) muted?) + {:color (if (theme/dark?) colors/neutral-60 colors/neutral-40)})) :weight :medium :size :paragraph-1} (str "# " name)]] [rn/view {:style {:height 20}} (when (and (not locked?) diff --git a/src/quo2/components/list_items/menu_item.cljs b/src/quo2/components/list_items/menu_item.cljs index d26a42ed40..115f92e081 100644 --- a/src/quo2/components/list_items/menu_item.cljs +++ b/src/quo2/components/list_items/menu_item.cljs @@ -1,5 +1,5 @@ (ns quo2.components.list-items.menu-item - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors :refer [theme-colors]] [quo2.components.markdown.text :as text] [quo2.components.icon :as icons])) diff --git a/src/quo2/components/list_items/preview_list.cljs b/src/quo2/components/list_items/preview_list.cljs index 06f957a007..b0de3edc0b 100644 --- a/src/quo2/components/list_items/preview_list.cljs +++ b/src/quo2/components/list_items/preview_list.cljs @@ -1,5 +1,6 @@ (ns quo2.components.list-items.preview-list - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] + [react-native.hole-view :as hole-view] [status-im.i18n.i18n :as i18n] [quo2.foundations.colors :as colors] [quo2.components.icon :as quo2.icons] @@ -42,13 +43,13 @@ (defn list-item [index type size item list-size margin-left hole-size hole-radius hole-x hole-y border-radius] (let [last-item? (= index (- list-size 1))] - [rn/hole-view {:style {:margin-left (if (= index 0) 0 margin-left)} - :holes (if last-item? [] - [{:x hole-x - :y hole-y - :width hole-size - :height hole-size - :borderRadius hole-radius}])} + [hole-view/hole-view {:style {:margin-left (if (= index 0) 0 margin-left)} + :holes (if last-item? [] + [{:x hole-x + :y hole-y + :width hole-size + :height hole-size + :borderRadius hole-radius}])} [avatar item type size border-radius]])) (defn get-overflow-color [transparent? transparent-color light-color dark-color override-theme] diff --git a/src/quo2/components/list_items/received_cr_item.cljs b/src/quo2/components/list_items/received_cr_item.cljs index e58833028c..e5dcbbb12d 100644 --- a/src/quo2/components/list_items/received_cr_item.cljs +++ b/src/quo2/components/list_items/received_cr_item.cljs @@ -1,5 +1,5 @@ (ns quo2.components.list-items.received-cr-item - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [status-im.utils.handlers :refer [evt]] [quo2.components.avatars.user-avatar :as user-avatar] diff --git a/src/quo2/components/markdown/text.cljs b/src/quo2/components/markdown/text.cljs index 2e66b86976..cd47639bca 100644 --- a/src/quo2/components/markdown/text.cljs +++ b/src/quo2/components/markdown/text.cljs @@ -1,6 +1,6 @@ (ns quo2.components.markdown.text - (:require [quo.react-native :as rn] - [quo.theme :as theme] + (:require [react-native.core :as rn] + [quo2.theme :as theme] [quo2.foundations.colors :as colors] [quo2.foundations.typography :as typography] [reagent.core :as reagent])) diff --git a/src/quo2/components/messages/gap.cljs b/src/quo2/components/messages/gap.cljs index beddc6776b..acd63ab9b8 100644 --- a/src/quo2/components/messages/gap.cljs +++ b/src/quo2/components/messages/gap.cljs @@ -1,8 +1,8 @@ (ns quo2.components.messages.gap (:require [oops.core :refer [oget]] - [quo.react-native :as rn] - [quo.theme :as theme] + [react-native.core :as rn] + [quo2.theme :as theme] [quo2.components.icon :as icon] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] diff --git a/src/quo2/components/messages/system_message.cljs b/src/quo2/components/messages/system_message.cljs index 9140e709f3..77ff39f36c 100644 --- a/src/quo2/components/messages/system_message.cljs +++ b/src/quo2/components/messages/system_message.cljs @@ -1,11 +1,11 @@ (ns quo2.components.messages.system-message - (:require [quo.react-native :as rn] - [quo.theme :as theme] + (:require [react-native.core :as rn] + [react-native.reanimated :as reanimated] + [quo2.theme :as theme] [quo2.components.avatars.icon-avatar :as icon-avatar] [quo2.components.avatars.user-avatar :as user-avatar] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] - [quo2.reanimated :as ra] [status-im.i18n.i18n :as i18n] [status-im.utils.core :as utils])) @@ -140,16 +140,16 @@ [{:keys [type style non-pressable? animate-landing?] :as message}] [:f> (fn [] - (let [sv-color (ra/use-shared-value + (let [sv-color (reanimated/use-shared-value (get-color :bg (if animate-landing? :landed :default) type))] (when animate-landing? - (ra/animate-shared-value-with-delay + (reanimated/animate-shared-value-with-delay sv-color (get-color :bg :default type) 0 :linear 1000)) - [ra/touchable-opacity + [reanimated/touchable-opacity {:on-press #(when-not non-pressable? - (ra/set-shared-value + (reanimated/set-shared-value sv-color (get-color :bg :pressed type))) - :style (ra/apply-animations-to-style + :style (reanimated/apply-animations-to-style {:background-color sv-color} (merge {:flex-direction :row diff --git a/src/quo2/components/navigation/bottom_nav_tab.cljs b/src/quo2/components/navigation/bottom_nav_tab.cljs index 6bfecae9fa..78918ed164 100644 --- a/src/quo2/components/navigation/bottom_nav_tab.cljs +++ b/src/quo2/components/navigation/bottom_nav_tab.cljs @@ -1,6 +1,7 @@ (ns quo2.components.navigation.bottom-nav-tab - (:require [quo.react-native :as rn] - [quo2.reanimated :as reanimated] + (:require [react-native.core :as rn] + [react-native.reanimated :as reanimated] + [react-native.hole-view :as hole-view] [quo2.foundations.colors :as colors] [quo2.components.icons.icons :as icons] [quo2.components.counter.counter :as counter])) @@ -44,18 +45,18 @@ :on-press-out #(toggle-background-color background-color true pass-through?) :accessibility-label accessibility-label} [reanimated/view {:style background-animated-style} - [rn/hole-view {:style {:padding-left 33 - :padding-top 8} - :key new-notifications? ;; Key is required to force removal of holes - :holes (cond - (not new-notifications?) ;; No new notifications, remove holes - [] + [hole-view/hole-view {:style {:padding-left 33 + :padding-top 8} + :key new-notifications? ;; Key is required to force removal of holes + :holes (cond + (not new-notifications?) ;; No new notifications, remove holes + [] - (= notification-indicator :unread-dot) - [{:x 50 :y 5 :width 10 :height 10 :borderRadius 5}] + (= notification-indicator :unread-dot) + [{:x 50 :y 5 :width 10 :height 10 :borderRadius 5}] - :else - [{:x 47 :y 1 :width 18 :height 18 :borderRadius 7}])} + :else + [{:x 47 :y 1 :width 18 :height 18 :borderRadius 7}])} [reanimated/image {:style icon-animated-style :source (icons/icon-source (keyword (str icon 24)))}]] diff --git a/src/quo2/components/navigation/floating_shell_button.cljs b/src/quo2/components/navigation/floating_shell_button.cljs index ca272cbf89..67adeb51d5 100644 --- a/src/quo2/components/navigation/floating_shell_button.cljs +++ b/src/quo2/components/navigation/floating_shell_button.cljs @@ -1,5 +1,5 @@ (ns quo2.components.navigation.floating-shell-button - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.components.buttons.dynamic-button :as dynamic-button])) (defn dynamic-button-view [type dynamic-buttons style] diff --git a/src/quo2/components/navigation/page_nav.cljs b/src/quo2/components/navigation/page_nav.cljs index a589952136..1a4bb0b6c4 100644 --- a/src/quo2/components/navigation/page_nav.cljs +++ b/src/quo2/components/navigation/page_nav.cljs @@ -1,10 +1,10 @@ (ns quo2.components.navigation.page-nav - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [quo2.components.icon :as icons] [status-im.utils.dimensions :as dimensions] - [clojure.string :as string] - [quo2.components.markdown.text :as text])) + [quo2.components.markdown.text :as text] + [clojure.string :as string])) (def ^:private centrify-style {:display :flex diff --git a/src/quo2/components/navigation/top_nav.cljs b/src/quo2/components/navigation/top_nav.cljs index 5d32fbd204..fe76adcbda 100644 --- a/src/quo2/components/navigation/top_nav.cljs +++ b/src/quo2/components/navigation/top_nav.cljs @@ -1,9 +1,10 @@ (ns quo2.components.navigation.top-nav - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [quo2.components.counter.counter :as counter] [quo2.components.buttons.button :as quo2.button] - [quo2.components.avatars.user-avatar :as user-avatar])) + [quo2.components.avatars.user-avatar :as user-avatar] + [react-native.hole-view :as hole-view])) (defn- get-button-common-props [type] (let [default? (= type :default) @@ -67,16 +68,16 @@ [base-button :main-icons2/qr-code show-qr :show-qr-button button-common-props] [rn/view ;; Keep view instead of "[:<>" to make sure relative ;; position is calculated from this view instead of its parent - [rn/hole-view {:key new-notifications? ;; Key is required to force removal of holes - :holes (cond - (not new-notifications?) ;; No new notifications, remove holes - [] + [hole-view/hole-view {:key new-notifications? ;; Key is required to force removal of holes + :holes (cond + (not new-notifications?) ;; No new notifications, remove holes + [] - (= notification-indicator :unread-dot) - [{:x 37 :y -3 :width 10 :height 10 :borderRadius 5}] + (= notification-indicator :unread-dot) + [{:x 37 :y -3 :width 10 :height 10 :borderRadius 5}] - :else - [{:x 33 :y -7 :width 18 :height 18 :borderRadius 7}])} + :else + [{:x 33 :y -7 :width 18 :height 18 :borderRadius 7}])} [base-button :main-icons2/activity-center open-activity-center :open-activity-center-button button-common-props]] (when new-notifications? diff --git a/src/quo2/components/notifications/activity_logs.cljs b/src/quo2/components/notifications/activity_logs.cljs index b768bda0e0..e499e505dc 100644 --- a/src/quo2/components/notifications/activity_logs.cljs +++ b/src/quo2/components/notifications/activity_logs.cljs @@ -1,5 +1,5 @@ (ns quo2.components.notifications.activity-logs - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.components.buttons.button :as button] [quo2.components.icon :as icon] [quo2.components.markdown.text :as text] diff --git a/src/quo2/components/notifications/info_count.cljs b/src/quo2/components/notifications/info_count.cljs index 1a7e9aa7af..02edd4a45d 100644 --- a/src/quo2/components/notifications/info_count.cljs +++ b/src/quo2/components/notifications/info_count.cljs @@ -1,5 +1,5 @@ (ns quo2.components.notifications.info-count - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [quo2.foundations.typography :as typography])) diff --git a/src/quo2/components/notifications/notification_dot.cljs b/src/quo2/components/notifications/notification_dot.cljs index cc15ef6a40..eb652f3ff8 100644 --- a/src/quo2/components/notifications/notification_dot.cljs +++ b/src/quo2/components/notifications/notification_dot.cljs @@ -1,5 +1,5 @@ (ns quo2.components.notifications.notification-dot - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors])) (defn notification-dot [style] diff --git a/src/quo2/components/reactions/reaction.cljs b/src/quo2/components/reactions/reaction.cljs index 0104e7f661..fd1bc0e634 100644 --- a/src/quo2/components/reactions/reaction.cljs +++ b/src/quo2/components/reactions/reaction.cljs @@ -1,7 +1,7 @@ (ns quo2.components.reactions.reaction (:require [quo2.components.markdown.text :as quo2.text] - [quo.react-native :as rn] - [quo.theme :as theme] + [react-native.core :as rn] + [quo2.theme :as theme] [quo2.foundations.colors :as colors] [quo2.components.icon :as icons])) diff --git a/src/quo2/components/selectors/disclaimer.cljs b/src/quo2/components/selectors/disclaimer.cljs index ff96b3882b..49c997d826 100644 --- a/src/quo2/components/selectors/disclaimer.cljs +++ b/src/quo2/components/selectors/disclaimer.cljs @@ -1,5 +1,5 @@ (ns quo2.components.selectors.disclaimer - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [quo2.components.markdown.text :as text] [quo2.components.selectors.selectors :as selectors])) diff --git a/src/quo2/components/selectors/selectors.cljs b/src/quo2/components/selectors/selectors.cljs index 52c783c511..6616cc78f1 100644 --- a/src/quo2/components/selectors/selectors.cljs +++ b/src/quo2/components/selectors/selectors.cljs @@ -1,7 +1,7 @@ (ns quo2.components.selectors.selectors - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] - [quo.theme :as theme] + [quo2.theme :as theme] [reagent.core :as reagent] [quo2.components.icon :as icons])) diff --git a/src/quo2/components/separator.cljs b/src/quo2/components/separator.cljs index cbcd7706a7..5d7e7868df 100644 --- a/src/quo2/components/separator.cljs +++ b/src/quo2/components/separator.cljs @@ -1,9 +1,9 @@ (ns quo2.components.separator - (:require [quo.react-native :as react] + (:require [react-native.core :as rn] [quo2.foundations.colors :as quo2.colors])) (defn separator [{:keys [style]}] - [react/view + [rn/view {:style (merge style diff --git a/src/quo2/components/switcher/switcher_cards.cljs b/src/quo2/components/switcher/switcher_cards.cljs index c2024db4b0..4b7587063a 100644 --- a/src/quo2/components/switcher/switcher_cards.cljs +++ b/src/quo2/components/switcher/switcher_cards.cljs @@ -1,5 +1,5 @@ (ns quo2.components.switcher.switcher-cards - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [status-im.i18n.i18n :as i18n] [quo2.foundations.colors :as colors] [quo2.components.markdown.text :as text] diff --git a/src/quo2/components/tabs/account_selector.cljs b/src/quo2/components/tabs/account_selector.cljs index 17492cc6c7..0f0b851d98 100644 --- a/src/quo2/components/tabs/account_selector.cljs +++ b/src/quo2/components/tabs/account_selector.cljs @@ -1,7 +1,7 @@ (ns quo2.components.tabs.account-selector (:require - [quo.theme :as theme] - [quo.react-native :as rn] + [quo2.theme :as theme] + [react-native.core :as rn] [quo2.foundations.colors :as colors] [quo2.components.markdown.text :as quo2])) diff --git a/src/quo2/components/tabs/segmented_tab.cljs b/src/quo2/components/tabs/segmented_tab.cljs index 3206983f6f..229779782e 100644 --- a/src/quo2/components/tabs/segmented_tab.cljs +++ b/src/quo2/components/tabs/segmented_tab.cljs @@ -1,9 +1,9 @@ (ns quo2.components.tabs.segmented-tab (:require [reagent.core :as reagent] - [quo.react-native :as rn] + [react-native.core :as rn] [quo2.components.tabs.tab :as tab] [quo2.foundations.colors :as colors] - [quo.theme :as theme])) + [quo2.theme :as theme])) (def themes {:light {:background-color colors/neutral-20} :dark {:background-color colors/neutral-80}}) diff --git a/src/quo2/components/tabs/tab.cljs b/src/quo2/components/tabs/tab.cljs index 073fe7b62f..18b056a9b7 100644 --- a/src/quo2/components/tabs/tab.cljs +++ b/src/quo2/components/tabs/tab.cljs @@ -1,7 +1,7 @@ (ns quo2.components.tabs.tab (:require [quo2.foundations.colors :as colors] - [quo.react-native :as rn] - [quo.theme :as theme] + [react-native.core :as rn] + [quo2.theme :as theme] [status-im.ui.components.icons.icons :as icons] [quo2.components.markdown.text :as text])) diff --git a/src/quo2/components/tabs/tabs.cljs b/src/quo2/components/tabs/tabs.cljs index 4ca8fb94d3..cf4ce781fa 100644 --- a/src/quo2/components/tabs/tabs.cljs +++ b/src/quo2/components/tabs/tabs.cljs @@ -1,6 +1,6 @@ (ns quo2.components.tabs.tabs (:require [oops.core :refer [oget]] - [quo.react-native :as rn] + [react-native.core :as rn] [quo2.components.tabs.tab :as tab] [reagent.core :as reagent] [status-im.ui.components.react :as react] diff --git a/src/quo2/components/tags/base_tag.cljs b/src/quo2/components/tags/base_tag.cljs index 6937f218f3..af3180ba18 100644 --- a/src/quo2/components/tags/base_tag.cljs +++ b/src/quo2/components/tags/base_tag.cljs @@ -1,6 +1,5 @@ (ns quo2.components.tags.base-tag - (:require - [quo.react-native :as rn])) + (:require [react-native.core :as rn])) (defn style-container [size disabled border-color border-width background-color label type] (merge {:height size diff --git a/src/quo2/components/tags/context_tags.cljs b/src/quo2/components/tags/context_tags.cljs index b2147f6944..7fa09e18c6 100644 --- a/src/quo2/components/tags/context_tags.cljs +++ b/src/quo2/components/tags/context_tags.cljs @@ -1,9 +1,9 @@ (ns quo2.components.tags.context-tags (:require [quo2.foundations.colors :as colors] - [quo.theme :as quo.theme] + [quo2.theme :as quo2.theme] [quo2.components.markdown.text :as text] [quo2.components.avatars.group-avatar :as group-avatar] - [quo.react-native :as rn])) + [react-native.core :as rn])) (defn padding-left-for-type [type] (case type @@ -15,7 +15,7 @@ (defn base-tag [_ _] (fn [{:keys [override-theme style]} & children] - (let [theme (or override-theme (quo.theme/get-theme))] + (let [theme (or override-theme (quo2.theme/get-theme))] (into [rn/view (merge diff --git a/src/quo2/components/tags/status_tags.cljs b/src/quo2/components/tags/status_tags.cljs index b9383cd308..52b421ce42 100644 --- a/src/quo2/components/tags/status_tags.cljs +++ b/src/quo2/components/tags/status_tags.cljs @@ -1,6 +1,6 @@ (ns quo2.components.tags.status-tags - (:require [quo.react-native :as rn] - [quo.theme :as quo.theme] + (:require [react-native.core :as rn] + [quo2.theme :as quo2.theme] [quo2.components.icon :as icon] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] @@ -91,5 +91,5 @@ nil)] [status-component size - (or override-theme (quo.theme/get-theme)) + (or override-theme (quo2.theme/get-theme)) label]))) diff --git a/src/quo2/components/tags/tag.cljs b/src/quo2/components/tags/tag.cljs index 25a3ae9835..0243fa777d 100644 --- a/src/quo2/components/tags/tag.cljs +++ b/src/quo2/components/tags/tag.cljs @@ -1,7 +1,7 @@ (ns quo2.components.tags.tag (:require [quo2.foundations.colors :as colors] - [quo.theme :as theme] - [quo.react-native :as rn] + [quo2.theme :as theme] + [react-native.core :as rn] [quo2.components.icon :as icons] [quo2.components.markdown.text :as text] [quo2.components.tags.base-tag :as base-tag])) diff --git a/src/quo2/components/tags/tags.cljs b/src/quo2/components/tags/tags.cljs index f81e1ea3a7..c1cccc5205 100644 --- a/src/quo2/components/tags/tags.cljs +++ b/src/quo2/components/tags/tags.cljs @@ -1,6 +1,6 @@ (ns quo2.components.tags.tags (:require [reagent.core :as reagent] - [quo.react-native :as rn] + [react-native.core :as rn] [quo2.components.tags.tag :as tag])) (defn tags [{:keys [default-active on-change]}] diff --git a/src/quo2/components/tags/token_tag.cljs b/src/quo2/components/tags/token_tag.cljs index 2e1bf85435..90a89ee5ec 100644 --- a/src/quo2/components/tags/token_tag.cljs +++ b/src/quo2/components/tags/token_tag.cljs @@ -1,7 +1,7 @@ (ns quo2.components.tags.token-tag (:require [quo2.foundations.colors :as colors] - [quo.react-native :as rn] - [quo.theme :as theme] + [react-native.core :as rn] + [quo2.theme :as theme] [quo2.components.markdown.text :as text] [quo2.components.icon :as icons])) diff --git a/src/quo2/components/wallet/lowest_price.cljs b/src/quo2/components/wallet/lowest_price.cljs index 974f626677..f29c46c99e 100644 --- a/src/quo2/components/wallet/lowest_price.cljs +++ b/src/quo2/components/wallet/lowest_price.cljs @@ -1,5 +1,5 @@ (ns quo2.components.wallet.lowest-price - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [clojure.string :as string])) (def centrify {:style {:flex-direction :row diff --git a/src/quo2/components/wallet/network_amount.cljs b/src/quo2/components/wallet/network_amount.cljs index 929d52c184..4f43ac40b2 100644 --- a/src/quo2/components/wallet/network_amount.cljs +++ b/src/quo2/components/wallet/network_amount.cljs @@ -1,6 +1,6 @@ (ns quo2.components.wallet.network-amount (:require [clojure.string :as string] - [quo.react-native :as rn] + [react-native.core :as rn] [quo2.components.icon :as icon] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] diff --git a/src/quo2/components/wallet/network_breakdown.cljs b/src/quo2/components/wallet/network_breakdown.cljs index 093299b0c9..ff0581e668 100644 --- a/src/quo2/components/wallet/network_breakdown.cljs +++ b/src/quo2/components/wallet/network_breakdown.cljs @@ -1,5 +1,5 @@ (ns quo2.components.wallet.network-breakdown - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] [quo2.components.markdown.text :as text] [quo2.components.wallet.network-amount :refer [network-amount]])) diff --git a/src/quo2/components/wallet/token_overview.cljs b/src/quo2/components/wallet/token_overview.cljs index 95938a718e..2aa5318990 100644 --- a/src/quo2/components/wallet/token_overview.cljs +++ b/src/quo2/components/wallet/token_overview.cljs @@ -2,7 +2,7 @@ (:require [quo2.foundations.colors :as colors] [status-im.i18n.i18n :as i18n] - [quo.react-native :as rn] + [react-native.core :as rn] [clojure.string :as string] [status-im.utils.currency :as currencies] [status-im.ui.components.icons.icons :as icons] diff --git a/src/quo2/foundations/colors.cljs b/src/quo2/foundations/colors.cljs index 3d81c7cc76..259e766ac5 100644 --- a/src/quo2/foundations/colors.cljs +++ b/src/quo2/foundations/colors.cljs @@ -1,6 +1,6 @@ (ns quo2.foundations.colors (:require [clojure.string :as string] - [quo.theme :as theme])) + [quo2.theme :as theme])) (defn alpha [value opacity] (when value diff --git a/src/quo2/screens/avatars/account_avatar.cljs b/src/quo2/screens/avatars/account_avatar.cljs index 752718269b..f7541a9d3d 100644 --- a/src/quo2/screens/avatars/account_avatar.cljs +++ b/src/quo2/screens/avatars/account_avatar.cljs @@ -1,8 +1,7 @@ (ns quo2.screens.avatars.account-avatar (:require [reagent.core :as reagent] - [quo.react-native :as rn] - [quo.previews.preview :as preview] - [quo.design-system.colors :as colors] + [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.components.avatars.account-avatar :as quo2])) (def descriptor [{:label "Icon" @@ -40,8 +39,7 @@ [quo2/account-avatar @state]]]))) (defn preview-account-avatar [] - [rn/view {:background-color (:preview-background @colors/theme) - :flex 1} + [rn/view {:flex 1} [rn/flat-list {:flex 1 :keyboardShouldPersistTaps :always :header [cool-preview] diff --git a/src/quo2/screens/avatars/channel_avatar.cljs b/src/quo2/screens/avatars/channel_avatar.cljs index e9b0e5ebfe..bb1d21b1a0 100644 --- a/src/quo2/screens/avatars/channel_avatar.cljs +++ b/src/quo2/screens/avatars/channel_avatar.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.avatars.channel-avatar (:require [reagent.core :as reagent] - [quo.react-native :as rn] - [quo.previews.preview :as preview] + [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.avatars.channel-avatar :as quo2])) diff --git a/src/quo2/screens/avatars/group_avatar.cljs b/src/quo2/screens/avatars/group_avatar.cljs index f5fd1acf0b..192620a00e 100644 --- a/src/quo2/screens/avatars/group_avatar.cljs +++ b/src/quo2/screens/avatars/group_avatar.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.avatars.group-avatar (:require [reagent.core :as reagent] - [quo.react-native :as rn] - [quo.previews.preview :as preview] + [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.avatars.group-avatar :as quo2])) diff --git a/src/quo2/screens/avatars/icon_avatar.cljs b/src/quo2/screens/avatars/icon_avatar.cljs index 5a658cf67b..b04e911269 100644 --- a/src/quo2/screens/avatars/icon_avatar.cljs +++ b/src/quo2/screens/avatars/icon_avatar.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.avatars.icon-avatar (:require [reagent.core :as reagent] - [quo.react-native :as rn] - [quo.previews.preview :as preview] + [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.avatars.icon-avatar :as quo2])) diff --git a/src/quo2/screens/avatars/user_avatar.cljs b/src/quo2/screens/avatars/user_avatar.cljs index 50e7caaf0d..a57ef3bdd0 100644 --- a/src/quo2/screens/avatars/user_avatar.cljs +++ b/src/quo2/screens/avatars/user_avatar.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.avatars.user-avatar - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.components.avatars.user-avatar :as quo2] [reagent.core :as reagent] [status-im.react-native.resources :as resources])) diff --git a/src/quo2/screens/avatars/wallet_user_avatar.cljs b/src/quo2/screens/avatars/wallet_user_avatar.cljs index f623f7dc31..17f94793e1 100644 --- a/src/quo2/screens/avatars/wallet_user_avatar.cljs +++ b/src/quo2/screens/avatars/wallet_user_avatar.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.avatars.wallet-user-avatar - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [reagent.core :as reagent] [quo2.components.avatars.wallet-user-avatar :as quo2] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/screens/buttons/button.cljs b/src/quo2/screens/buttons/button.cljs index fbbaa1d91b..b4381a09ae 100644 --- a/src/quo2/screens/buttons/button.cljs +++ b/src/quo2/screens/buttons/button.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.buttons.button (:require [reagent.core :as reagent] - [quo.react-native :as rn] - [quo.previews.preview :as preview] + [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.buttons.button :as quo2])) diff --git a/src/quo2/screens/buttons/dynamic_button.cljs b/src/quo2/screens/buttons/dynamic_button.cljs index 3c93247229..8283b8b55c 100644 --- a/src/quo2/screens/buttons/dynamic_button.cljs +++ b/src/quo2/screens/buttons/dynamic_button.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.buttons.dynamic-button - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [reagent.core :as reagent] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.buttons.dynamic-button :as quo2])) diff --git a/src/quo2/screens/code/snippet.cljs b/src/quo2/screens/code/snippet.cljs index 7bd1eee2b4..424e6225ae 100644 --- a/src/quo2/screens/code/snippet.cljs +++ b/src/quo2/screens/code/snippet.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.code.snippet - (:require [quo.previews.preview :as preview] - [quo.react-native :as rn] + (:require [quo2.screens.preview :as preview] + [react-native.core :as rn] [quo2.components.code.snippet :as snippet] [quo2.foundations.colors :as colors] [reagent.core :as reagent])) diff --git a/src/quo2/screens/community/community_card_view.cljs b/src/quo2/screens/community/community_card_view.cljs index 32c6e1fb38..69f4d23971 100644 --- a/src/quo2/screens/community/community_card_view.cljs +++ b/src/quo2/screens/community/community_card_view.cljs @@ -1,9 +1,8 @@ (ns quo2.screens.community.community-card-view - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [reagent.core :as reagent] [status-im.constants :as constants] - [quo.design-system.colors :as quo.colors] [quo2.foundations.colors :as colors] [quo2.components.community.community-list-view :as community-list-view] [quo2.components.community.community-card-view :as community-card-view] @@ -19,7 +18,6 @@ :permissions true :cover (resources/get-image :community-cover) :community-icon (resources/get-image :status-logo) - :color (rand-nth quo.colors/chat-colors) :tokens [{:id 1 :group [{:id 1 :token-icon (resources/get-image :status-logo)}]}] :tags [{:id 1 :tag-label (i18n/label :t/music) :resource (resources/get-image :music)} {:id 2 :tag-label (i18n/label :t/lifestyle) :resource (resources/get-image :lifestyle)} diff --git a/src/quo2/screens/counter/counter.cljs b/src/quo2/screens/counter/counter.cljs index 7dca8333c1..c4291c9df2 100644 --- a/src/quo2/screens/counter/counter.cljs +++ b/src/quo2/screens/counter/counter.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.counter.counter - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [reagent.core :as reagent] [quo2.components.counter.counter :as quo2] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/screens/dividers/divider_label.cljs b/src/quo2/screens/dividers/divider_label.cljs index 21aea0f652..81fcf8ed18 100644 --- a/src/quo2/screens/dividers/divider_label.cljs +++ b/src/quo2/screens/dividers/divider_label.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.dividers.divider-label - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [reagent.core :as reagent] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.dividers.divider-label :as divider-label])) diff --git a/src/quo2/screens/dividers/new_messages.cljs b/src/quo2/screens/dividers/new_messages.cljs index a2f388137f..363c6dea9e 100644 --- a/src/quo2/screens/dividers/new_messages.cljs +++ b/src/quo2/screens/dividers/new_messages.cljs @@ -1,9 +1,10 @@ (ns quo2.screens.dividers.new-messages - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [reagent.core :as reagent] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] - [quo2.components.dividers.new-messages :as new-messages])) + [quo2.components.dividers.new-messages :as new-messages] + [status-im.i18n.i18n :as i18n])) (def descriptor [{:label "Label" :key :label @@ -36,7 +37,7 @@ {:key :beige :value "Beige"}]}]) (defn cool-preview [] - (let [state (reagent/atom {:label "New messages" + (let [state (reagent/atom {:label (i18n/label :new-messages-header) :color :primary})] (fn [] [rn/touchable-without-feedback {:on-press rn/dismiss-keyboard!} diff --git a/src/quo2/screens/drawers/action_drawers.cljs b/src/quo2/screens/drawers/action_drawers.cljs index ffc080847b..48b5488f6b 100644 --- a/src/quo2/screens/drawers/action_drawers.cljs +++ b/src/quo2/screens/drawers/action_drawers.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.drawers.action-drawers - (:require [quo.previews.preview :as preview] - [quo.react-native :as rn] + (:require [quo2.screens.preview :as preview] + [react-native.core :as rn] [quo2.components.drawers.action-drawers :as quo2] [quo2.components.buttons.button :as button] [quo2.foundations.colors :as colors] diff --git a/src/quo2/screens/dropdowns/dropdown.cljs b/src/quo2/screens/dropdowns/dropdown.cljs index 8c69645135..73134f7e26 100644 --- a/src/quo2/screens/dropdowns/dropdown.cljs +++ b/src/quo2/screens/dropdowns/dropdown.cljs @@ -1,7 +1,6 @@ (ns quo2.screens.dropdowns.dropdown - (:require [quo.components.text :as text] - [quo.previews.preview :as preview] - [quo.react-native :as rn] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.components.dropdowns.dropdown :as quo2] [quo2.foundations.colors :as colors] [reagent.core :as reagent])) @@ -64,7 +63,7 @@ [preview/customizer state descriptor] [rn/view {:padding-vertical 60 :align-items :center} - [text/text {:color :main} (str "Selected item: " @selected-item)] + [rn/text (str "Selected item: " @selected-item)] [quo2/dropdown (merge @state {:on-select on-select :items items})]]]]))) diff --git a/src/quo2/screens/info/info_message.cljs b/src/quo2/screens/info/info_message.cljs index f244a05d7b..a7b6d957ba 100644 --- a/src/quo2/screens/info/info_message.cljs +++ b/src/quo2/screens/info/info_message.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.info.info-message - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [reagent.core :as reagent] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.info.info-message :as quo2])) diff --git a/src/quo2/screens/info/information_box.cljs b/src/quo2/screens/info/information_box.cljs index 3fc9e4e8ac..7f094f9c5d 100644 --- a/src/quo2/screens/info/information_box.cljs +++ b/src/quo2/screens/info/information_box.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.info.information-box - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [reagent.core :as reagent] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.info.information-box :as quo2])) diff --git a/src/quo2/screens/list_items/channel.cljs b/src/quo2/screens/list_items/channel.cljs index 0d81bff4b4..309c2d8631 100644 --- a/src/quo2/screens/list_items/channel.cljs +++ b/src/quo2/screens/list_items/channel.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.list-items.channel - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [reagent.core :as reagent] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.list-items.channel :as quo2-channel])) diff --git a/src/quo2/screens/list_items/preview_lists.cljs b/src/quo2/screens/list_items/preview_lists.cljs index 4032167de4..c99c7b7db0 100644 --- a/src/quo2/screens/list_items/preview_lists.cljs +++ b/src/quo2/screens/list_items/preview_lists.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.list-items.preview-lists - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [reagent.core :as reagent] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [status-im.react-native.resources :as resources] [quo2.components.list-items.preview-list :as quo2])) diff --git a/src/quo2/screens/main.cljs b/src/quo2/screens/main.cljs index a1fa7e027f..75728d6ea6 100644 --- a/src/quo2/screens/main.cljs +++ b/src/quo2/screens/main.cljs @@ -1,10 +1,8 @@ (ns quo2.screens.main - (:require [quo.components.safe-area :as safe-area] - [quo.core :as quo] - [quo.design-system.colors :as quo.colors] + (:require [react-native.core :as rn] + [react-native.safe-area :as safe-area] [quo2.foundations.colors :as colors] - [quo.react-native :as rn] - [quo.theme :as theme] + [quo2.theme :as theme] [quo2.components.markdown.text :as quo2-text] [quo2.components.buttons.button :as quo2-button] [quo2.screens.avatars.channel-avatar :as channel-avatar] @@ -187,26 +185,9 @@ (defn theme-switcher [] [rn/view {:style {:flex-direction :row - :margin-vertical 8 - :border-radius 4 - :background-color (:ui-01 @quo.colors/theme) - :border-width 1 - :border-color (:ui-02 @quo.colors/theme)}} - [rn/touchable-opacity {:style {:padding 8 - :flex 1 - :justify-content :center - :align-items :center} - :on-press #(theme/set-theme :light)} - [quo/text "Set light theme"]] - [rn/view {:width 1 - :margin-vertical 4 - :background-color (:ui-02 @quo.colors/theme)}] - [rn/touchable-opacity {:style {:padding 8 - :flex 1 - :justify-content :center - :align-items :center} - :on-press #(theme/set-theme :dark)} - [quo/text "Set dark theme"]]]) + :margin-vertical 8}} + [quo2-button/button {:on-press #(theme/set-theme :light)} "Set light theme"] + [quo2-button/button {:on-press #(theme/set-theme :dark)} "Set dark theme"]]) (defn main-screen [] (fn [] diff --git a/src/quo2/screens/markdown/text.cljs b/src/quo2/screens/markdown/text.cljs index 459e7025f3..4c53260be6 100644 --- a/src/quo2/screens/markdown/text.cljs +++ b/src/quo2/screens/markdown/text.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.markdown.text (:require [quo2.foundations.colors :as colors] - [quo.previews.preview :as preview] - [quo.react-native :as rn] + [quo2.screens.preview :as preview] + [react-native.core :as rn] [quo2.components.markdown.text :as quo2] [reagent.core :as reagent])) diff --git a/src/quo2/screens/messages/gap.cljs b/src/quo2/screens/messages/gap.cljs index 1658b268df..d7281fa00a 100644 --- a/src/quo2/screens/messages/gap.cljs +++ b/src/quo2/screens/messages/gap.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.messages.gap (:require - [quo.previews.preview :as preview] - [quo.react-native :as rn] + [quo2.screens.preview :as preview] + [react-native.core :as rn] [quo2.components.messages.gap :as gap] [reagent.core :as reagent])) diff --git a/src/quo2/screens/messages/system_message.cljs b/src/quo2/screens/messages/system_message.cljs index 987dffc29e..5d06872c7b 100644 --- a/src/quo2/screens/messages/system_message.cljs +++ b/src/quo2/screens/messages/system_message.cljs @@ -1,8 +1,8 @@ (ns quo2.screens.messages.system-message (:require [reagent.core :as reagent] [status-im.react-native.resources :as resources] - [quo.react-native :as rn] - [quo.previews.preview :as preview] + [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.components.messages.system-message :as system-message] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/screens/navigation/bottom_nav_tab.cljs b/src/quo2/screens/navigation/bottom_nav_tab.cljs index e9aa78bd03..9344788010 100644 --- a/src/quo2/screens/navigation/bottom_nav_tab.cljs +++ b/src/quo2/screens/navigation/bottom_nav_tab.cljs @@ -1,8 +1,8 @@ (ns quo2.screens.navigation.bottom-nav-tab - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [react-native.reanimated :as reanimated] + [quo2.screens.preview :as preview] [reagent.core :as reagent] - [quo2.reanimated :as reanimated] [quo2.components.navigation.bottom-nav-tab :as quo2] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/screens/navigation/floating_shell_button.cljs b/src/quo2/screens/navigation/floating_shell_button.cljs index 3b246d0af4..42c7786a5c 100644 --- a/src/quo2/screens/navigation/floating_shell_button.cljs +++ b/src/quo2/screens/navigation/floating_shell_button.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.navigation.floating-shell-button - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [reagent.core :as reagent] [quo2.components.navigation.floating-shell-button :as quo2] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/screens/navigation/page_nav.cljs b/src/quo2/screens/navigation/page_nav.cljs index b343e6f0c0..9c00f93b00 100644 --- a/src/quo2/screens/navigation/page_nav.cljs +++ b/src/quo2/screens/navigation/page_nav.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.navigation.page-nav - (:require [quo.previews.preview :as preview] - [quo.react-native :as rn] + (:require [quo2.screens.preview :as preview] + [react-native.core :as rn] [quo2.components.navigation.page-nav :as quo2] [quo2.foundations.colors :as colors] [reagent.core :as reagent])) diff --git a/src/quo2/screens/navigation/top_nav.cljs b/src/quo2/screens/navigation/top_nav.cljs index 6a2152b132..d38b545bff 100644 --- a/src/quo2/screens/navigation/top_nav.cljs +++ b/src/quo2/screens/navigation/top_nav.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.navigation.top-nav - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [reagent.core :as reagent] [quo2.components.navigation.top-nav :as quo2] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/screens/notifications/activity_logs.cljs b/src/quo2/screens/notifications/activity_logs.cljs index 99d554c36e..4b7816e68d 100644 --- a/src/quo2/screens/notifications/activity_logs.cljs +++ b/src/quo2/screens/notifications/activity_logs.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.notifications.activity-logs - (:require [quo.previews.preview :as preview] - [quo.react-native :as rn] + (:require [quo2.screens.preview :as preview] + [react-native.core :as rn] [quo2.components.markdown.text :as text] [quo2.components.notifications.activity-logs :as activity-logs] [quo2.components.tags.context-tags :as context-tags] diff --git a/src/quo2/screens/preview.clj b/src/quo2/screens/preview.clj new file mode 100644 index 0000000000..1d0843a0ac --- /dev/null +++ b/src/quo2/screens/preview.clj @@ -0,0 +1,9 @@ +(ns quo2.screens.preview) + +(defmacro list-comp [[binding seq-expr & bindings] body-expr] + (cond (not binding) + `(list ~body-expr) + + :else + `(mapcat (fn [~binding] (list-comp ~bindings ~body-expr)) + ~seq-expr))) diff --git a/src/quo2/screens/preview.cljs b/src/quo2/screens/preview.cljs new file mode 100644 index 0000000000..bb9c917a9e --- /dev/null +++ b/src/quo2/screens/preview.cljs @@ -0,0 +1,179 @@ +(ns quo2.screens.preview + (:require [reagent.core :as reagent] + [react-native.core :as rn] + [quo2.foundations.colors :as colors]) + (:require-macros quo2.screens.preview)) + +(def container {:flex-direction :row + :padding-vertical 8 + :flex 1 + :align-items :center}) + +(defn touchable-style [] + {:flex 1 + :align-items :center + :justify-content :center + :padding-horizontal 16 + :height 44}) + +(defn select-style [] + {:flex 1 + :flex-direction :row + :align-items :center + :padding-horizontal 16 + :height 44 + :border-radius 4 + :background-color colors/neutral-20 + :border-width 1 + :border-color colors/neutral-100}) + +(defn select-option-style [selected] + (merge (select-style) + {:margin-vertical 8 + :justify-content :center} + (if selected + {:background-color colors/primary-50-opa-30} + {:background-color (colors/theme-colors colors/neutral-20 colors/white)}))) + +(def label-style {:flex 0.4 + :padding-right 8}) + +(defn label-view [_ label] + [rn/view {:style label-style} + [rn/text + (when-let [label-color (colors/theme-colors colors/neutral-100 colors/white)] + {:style {:color label-color}}) + label]]) + +(defn modal-container [] + {:flex 1 + :justify-content :center + :padding-horizontal 24 + :background-color "rgba(0,0,0,0.4)"}) + +(defn modal-view [] + {:padding-horizontal 16 + :padding-vertical 8 + :border-radius 8 + :flex-direction :column + :margin-vertical 100 + :background-color (colors/theme-colors colors/neutral-20 colors/white)}) + +(defn customizer-boolean + [{:keys [label key state]}] + (let [state* (reagent/cursor state [key])] + [rn/view {:style container} + [label-view state label] + [rn/view {:style {:flex-direction :row + :flex 0.6 + :border-radius 4 + :background-color (colors/theme-colors colors/neutral-20 colors/white) + :border-width 1 + :border-color (colors/theme-colors colors/neutral-100 colors/white)}} + [rn/touchable-opacity {:style (merge (touchable-style) {:background-color (when @state* colors/primary-50-opa-30)}) + :on-press #(reset! state* true)} + [rn/text + "True"]] + [rn/view {:width 1 + :margin-vertical 4 + :background-color (colors/theme-colors colors/neutral-20 colors/white)}] + [rn/touchable-opacity {:style (merge (touchable-style) {:background-color (when (not @state*) colors/primary-50-opa-30)}) + :on-press #(reset! state* false)} + [rn/text {} + "False"]]]])) + +(defn customizer-text + [{:keys [label key state]}] + (let [state* (reagent/cursor state [key])] + [rn/view {:style container} + [label-view state label] + [rn/view {:style {:flex 0.6}} + [rn/text-input {:value @state* + :show-cancel false + :style {:border-radius 4 + :border-width 1 + :border-color (colors/theme-colors colors/neutral-100 colors/white)} + :on-change-text #(do + (reset! state* %) + (reagent/flush))}]]])) + +(defn value-for-key + [id v] + (:value (first (filter #(= (:key %) id) v)))) + +(defn customizer-select [] + (let [open (reagent/atom nil)] + (fn [{:keys [label key state options]}] + (let [state* (reagent/cursor state [key]) + selected (value-for-key @state* options)] + [rn/view {:style container} + [label-view state label] + [rn/view {:style {:flex 0.6}} + [rn/modal {:visible @open + :on-request-close #(reset! open false) + :statusBarTranslucent true + :transparent true + :animation :slide} + [rn/view {:style (modal-container)} + [rn/view {:style (modal-view)} + [rn/scroll-view + (doall + (for [{:keys [key value]} options] + ^{:key key} + [rn/touchable-opacity {:style (select-option-style (= @state* key)) + :on-press #(do + (reset! open false) + (reset! state* key))} + [rn/text {:color (if (= @state* key) :link :secondary)} + value]]))] + [rn/view {:flex-direction :row :padding-top 20 :margin-top 10 + :border-top-width 1 :border-top-color (colors/theme-colors colors/neutral-100 colors/white)} + [rn/touchable-opacity {:style (select-option-style false) + :on-press #(do + (reset! state* nil) + (reset! open false))} + [rn/text "Clear"]] + [rn/view {:width 16}] + [rn/touchable-opacity {:style (select-option-style false) + :on-press #(reset! open false)} + [rn/text "Close"]]]]]] + + [rn/touchable-opacity {:style (select-style) + :on-press #(reset! open true)} + (if selected + [rn/text {:color :link} selected] + [rn/text "Select option"]) + [rn/view {:position :absolute + :right 16 + :top 0 + :bottom 0 + :justify-content :center} + [rn/text "↓"]]]]])))) + +(defn customizer [state descriptors] + [rn/view {:style {:flex 1} + :padding-horizontal 16} + (doall + (for [{:keys [key type] + :as desc} descriptors + :let [descriptor (merge desc + {:state state})]] + ^{:key key} + [:<> + (case type + :boolean [customizer-boolean descriptor] + :text [customizer-text descriptor] + :select [customizer-select descriptor])]))]) + +(comment + [{:label "Show error:" + :key :error + :type :boolean} + {:label "Label:" + :key :label + :type :text} + {:label "Type:" + :key :type + :type :select + :options [{:key :primary :value "Primary"} + {:key :secondary :value "Secondary"}]}]) diff --git a/src/quo2/screens/reactions/react.cljs b/src/quo2/screens/reactions/react.cljs index daa21ef978..fe976fcd90 100644 --- a/src/quo2/screens/reactions/react.cljs +++ b/src/quo2/screens/reactions/react.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.reactions.react - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [reagent.core :as reagent] [quo2.foundations.colors :as colors] [quo2.components.reactions.reaction :as quo2.reaction])) diff --git a/src/quo2/screens/selectors/disclaimer.cljs b/src/quo2/screens/selectors/disclaimer.cljs index 535eb87d63..4c57f31830 100644 --- a/src/quo2/screens/selectors/disclaimer.cljs +++ b/src/quo2/screens/selectors/disclaimer.cljs @@ -1,5 +1,5 @@ (ns quo2.screens.selectors.disclaimer - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [reagent.core :as reagent] [quo2.components.buttons.button :as button] [quo2.components.selectors.disclaimer :as quo2] diff --git a/src/quo2/screens/selectors/selectors.cljs b/src/quo2/screens/selectors/selectors.cljs index a1c071e0c2..d91a4c10f2 100644 --- a/src/quo2/screens/selectors/selectors.cljs +++ b/src/quo2/screens/selectors/selectors.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.selectors.selectors - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [reagent.core :as reagent] [quo2.components.selectors.selectors :as quo2] [quo2.components.markdown.text :as text] diff --git a/src/quo2/screens/switcher/switcher_cards.cljs b/src/quo2/screens/switcher/switcher_cards.cljs index 667e7568d9..7258969663 100644 --- a/src/quo2/screens/switcher/switcher_cards.cljs +++ b/src/quo2/screens/switcher/switcher_cards.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.switcher.switcher-cards - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [reagent.core :as reagent] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [status-im.react-native.resources :as resources] [quo2.components.switcher.switcher-cards :as switcher-cards])) diff --git a/src/quo2/screens/tabs/account_selector.cljs b/src/quo2/screens/tabs/account_selector.cljs index 347d06abd7..88a69cb392 100644 --- a/src/quo2/screens/tabs/account_selector.cljs +++ b/src/quo2/screens/tabs/account_selector.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.tabs.account-selector - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [reagent.core :as reagent] [quo2.foundations.colors :as colors] [quo2.components.tabs.account-selector :as quo2])) diff --git a/src/quo2/screens/tabs/segmented_tab.cljs b/src/quo2/screens/tabs/segmented_tab.cljs index 40af9e6b90..055f7f6a61 100644 --- a/src/quo2/screens/tabs/segmented_tab.cljs +++ b/src/quo2/screens/tabs/segmented_tab.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.tabs.segmented-tab - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.components.tabs.segmented-tab :as quo2] [reagent.core :as reagent])) diff --git a/src/quo2/screens/tabs/tabs.cljs b/src/quo2/screens/tabs/tabs.cljs index a5dbe4199a..fd2d6c3207 100644 --- a/src/quo2/screens/tabs/tabs.cljs +++ b/src/quo2/screens/tabs/tabs.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.tabs.tabs - (:require [quo.react-native :as rn] + (:require [react-native.core :as rn] [quo2.foundations.colors :as colors] - [quo.previews.preview :as preview] + [quo2.screens.preview :as preview] [quo2.components.tabs.tabs :as quo2] [reagent.core :as reagent])) diff --git a/src/quo2/screens/tags/context_tags.cljs b/src/quo2/screens/tags/context_tags.cljs index d3fd43fe35..9452360f1e 100644 --- a/src/quo2/screens/tags/context_tags.cljs +++ b/src/quo2/screens/tags/context_tags.cljs @@ -1,8 +1,8 @@ (ns quo2.screens.tags.context-tags (:require [reagent.core :as reagent] [status-im.multiaccounts.core :as multiaccounts] - [quo.react-native :as rn] - [quo.previews.preview :as preview] + [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.tags.context-tags :as quo2])) diff --git a/src/quo2/screens/tags/permission_tag.cljs b/src/quo2/screens/tags/permission_tag.cljs index e02d168f71..8b6ee94bf0 100644 --- a/src/quo2/screens/tags/permission_tag.cljs +++ b/src/quo2/screens/tags/permission_tag.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.tags.permission-tag - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.components.tags.permission-tag :as permission-tag] [quo2.foundations.colors :as colors] [status-im.react-native.resources :as resources] diff --git a/src/quo2/screens/tags/status_tags.cljs b/src/quo2/screens/tags/status_tags.cljs index 95f2f3a622..e9fb04ee62 100644 --- a/src/quo2/screens/tags/status_tags.cljs +++ b/src/quo2/screens/tags/status_tags.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.tags.status-tags (:require [reagent.core :as reagent] - [quo.react-native :as rn] - [quo.previews.preview :as preview] + [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.tags.status-tags :as quo2])) diff --git a/src/quo2/screens/tags/tags.cljs b/src/quo2/screens/tags/tags.cljs index 43ad167037..e461b04742 100644 --- a/src/quo2/screens/tags/tags.cljs +++ b/src/quo2/screens/tags/tags.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.tags.tags - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [status-im.ui.components.react :as react] [quo2.foundations.colors :as colors] [quo2.components.tags.tags :as tags] diff --git a/src/quo2/screens/tags/token_tag.cljs b/src/quo2/screens/tags/token_tag.cljs index a0de757246..2995f20e4f 100644 --- a/src/quo2/screens/tags/token_tag.cljs +++ b/src/quo2/screens/tags/token_tag.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.tags.token-tag - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [reagent.core :as reagent] [quo2.components.tags.token-tag :as quo2] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/screens/wallet/lowest_price.cljs b/src/quo2/screens/wallet/lowest_price.cljs index efec655458..bcab468dac 100644 --- a/src/quo2/screens/wallet/lowest_price.cljs +++ b/src/quo2/screens/wallet/lowest_price.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.wallet.lowest-price (:require [quo2.foundations.colors :as colors] - [quo.react-native :as rn] - [quo.previews.preview :as preview] + [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.components.wallet.lowest-price :as quo2] [reagent.core :as reagent])) diff --git a/src/quo2/screens/wallet/network_amount.cljs b/src/quo2/screens/wallet/network_amount.cljs index d9d1a20fc3..34991d8dce 100644 --- a/src/quo2/screens/wallet/network_amount.cljs +++ b/src/quo2/screens/wallet/network_amount.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.wallet.network-amount - (:require [quo.previews.preview :as preview] - [quo.react-native :as rn] + (:require [quo2.screens.preview :as preview] + [react-native.core :as rn] [quo2.components.wallet.network-amount :refer [network-amount]] [quo2.foundations.colors :as colors] [reagent.core :as reagent])) diff --git a/src/quo2/screens/wallet/network_breakdown.cljs b/src/quo2/screens/wallet/network_breakdown.cljs index 3b082fca88..49df6f37a8 100644 --- a/src/quo2/screens/wallet/network_breakdown.cljs +++ b/src/quo2/screens/wallet/network_breakdown.cljs @@ -1,7 +1,7 @@ (ns quo2.screens.wallet.network-breakdown (:require [reagent.core :as reagent] - [quo.react-native :as rn] - [quo.previews.preview :as preview] + [react-native.core :as rn] + [quo2.screens.preview :as preview] [quo2.foundations.colors :as colors] [quo2.components.wallet.network-breakdown :as quo2])) diff --git a/src/quo2/screens/wallet/token_overview.cljs b/src/quo2/screens/wallet/token_overview.cljs index 5fa071e8cb..077a3971d7 100644 --- a/src/quo2/screens/wallet/token_overview.cljs +++ b/src/quo2/screens/wallet/token_overview.cljs @@ -1,6 +1,6 @@ (ns quo2.screens.wallet.token-overview - (:require [quo.react-native :as rn] - [quo.previews.preview :as preview] + (:require [react-native.core :as rn] + [quo2.screens.preview :as preview] [reagent.core :as reagent] [quo2.components.wallet.token-overview :as quo2] [quo2.foundations.colors :as colors])) diff --git a/src/quo2/theme.cljs b/src/quo2/theme.cljs new file mode 100644 index 0000000000..2f859821bc --- /dev/null +++ b/src/quo2/theme.cljs @@ -0,0 +1,13 @@ +(ns quo2.theme + (:require [reagent.core :as reagent])) + +(def theme (reagent/atom nil)) + +(defn dark? [] + (= :dark @theme)) + +(defn get-theme [] + @theme) + +(defn set-theme [value] + (reset! theme value)) \ No newline at end of file diff --git a/src/react_native/core.cljs b/src/react_native/core.cljs new file mode 100644 index 0000000000..adccc68db3 --- /dev/null +++ b/src/react_native/core.cljs @@ -0,0 +1,29 @@ +(ns react-native.core + (:require [reagent.core :as reagent] + ["react-native" :as react-native] + [react-native.flat-list :as flat-list])) + +(def view (reagent/adapt-react-class (.-View ^js react-native))) +(def scroll-view (reagent/adapt-react-class (.-ScrollView ^js react-native))) +(def image (reagent/adapt-react-class (.-Image ^js react-native))) +(def text (reagent/adapt-react-class (.-Text ^js react-native))) +(def text-input (reagent/adapt-react-class (.-TextInput ^js react-native))) + +(def touchable-opacity (reagent/adapt-react-class (.-TouchableOpacity ^js react-native))) +(def touchable-highlight (reagent/adapt-react-class (.-TouchableHighlight ^js react-native))) +(def touchable-without-feedback (reagent/adapt-react-class (.-TouchableWithoutFeedback ^js react-native))) + +(def flat-list flat-list/flat-list) + +(def modal (reagent/adapt-react-class (.-Modal ^js react-native))) + +(def keyboard ^js (.-Keyboard ^js react-native)) + +(def dismiss-keyboard! #(.dismiss keyboard)) + +(defn use-window-dimensions [] + (let [window ^js (react-native/useWindowDimensions)] + {:font-scale (.-fontScale window) + :height (.-height window) + :scale (.-scale window) + :width (.-width window)})) \ No newline at end of file diff --git a/src/react_native/flat_list.cljs b/src/react_native/flat_list.cljs new file mode 100644 index 0000000000..a9baf00cf5 --- /dev/null +++ b/src/react_native/flat_list.cljs @@ -0,0 +1,35 @@ +(ns react-native.flat-list + (:require [reagent.core :as reagent] + ["react-native" :as react-native])) + +(def react-native-flat-list (reagent/adapt-react-class (.-FlatList ^js react-native))) + +(defn- wrap-render-fn [f render-data] + (fn [data] + (reagent/as-element [f (.-item ^js data) (.-index ^js data) + (.-separators ^js data) render-data + (.-isActive ^js data) (.-drag ^js data)]))) + +(defn- wrap-on-drag-end-fn [f] + (fn [data] + (f (.-from ^js data) (.-to ^js data) (.-data ^js data)))) + +(defn- wrap-key-fn [f] + (fn [data index] + {:post [(some? %)]} + (f data index))) + +(defn base-list-props + [{:keys [key-fn render-fn empty-component header footer separator data render-data on-drag-end-fn] :as props}] + (merge {:data (to-array data)} + (when key-fn {:keyExtractor (wrap-key-fn key-fn)}) + (when render-fn {:renderItem (wrap-render-fn render-fn render-data)}) + (when separator {:ItemSeparatorComponent (fn [] (reagent/as-element separator))}) + (when empty-component {:ListEmptyComponent (fn [] (reagent/as-element empty-component))}) + (when header {:ListHeaderComponent (reagent/as-element header)}) + (when footer {:ListFooterComponent (reagent/as-element footer)}) + (when on-drag-end-fn {:onDragEnd (wrap-on-drag-end-fn on-drag-end-fn)}) + (dissoc props :data :header :footer :empty-component :separator :render-fn :key-fn :on-drag-end-fn))) + +(defn flat-list [props] + [react-native-flat-list (base-list-props props)]) \ No newline at end of file diff --git a/src/quo2/gesture.cljs b/src/react_native/gesture.cljs similarity index 94% rename from src/quo2/gesture.cljs rename to src/react_native/gesture.cljs index 1ccdc712c3..eeec80e5b8 100644 --- a/src/quo2/gesture.cljs +++ b/src/react_native/gesture.cljs @@ -1,4 +1,4 @@ -(ns quo2.gesture +(ns react-native.gesture (:require ["react-native-gesture-handler" :refer (GestureDetector Gesture)] [reagent.core :as reagent])) diff --git a/src/react_native/hole_view.cljs b/src/react_native/hole_view.cljs new file mode 100644 index 0000000000..8ce6bd3d15 --- /dev/null +++ b/src/react_native/hole_view.cljs @@ -0,0 +1,5 @@ +(ns react-native.hole-view + (:require [reagent.core :as reagent] + ["react-native-hole-view" :refer (RNHoleView)])) + +(def hole-view (reagent/adapt-react-class RNHoleView)) \ No newline at end of file diff --git a/src/react_native/linear_gradient.cljs b/src/react_native/linear_gradient.cljs new file mode 100644 index 0000000000..33ae621193 --- /dev/null +++ b/src/react_native/linear_gradient.cljs @@ -0,0 +1,5 @@ +(ns react-native.linear-gradient + (:require ["react-native-linear-gradient" :default LinearGradient] + [reagent.core :as reagent])) + +(def linear-gradient (reagent/adapt-react-class LinearGradient)) \ No newline at end of file diff --git a/src/react_native/platform.cljs b/src/react_native/platform.cljs new file mode 100644 index 0000000000..85f70142a4 --- /dev/null +++ b/src/react_native/platform.cljs @@ -0,0 +1,9 @@ +(ns react-native.platform + (:require ["react-native" :as react-native])) + +(def platform (.-Platform ^js react-native)) + +(def os (when platform (.-OS ^js platform))) + +(def android? (= os "android")) +(def ios? (= os "ios")) \ No newline at end of file diff --git a/src/quo2/reanimated.cljs b/src/react_native/reanimated.cljs similarity index 98% rename from src/quo2/reanimated.cljs rename to src/react_native/reanimated.cljs index 95e5d3702a..93c3c79aeb 100644 --- a/src/quo2/reanimated.cljs +++ b/src/react_native/reanimated.cljs @@ -1,4 +1,4 @@ -(ns quo2.reanimated +(ns react-native.reanimated (:require ["react-native" :as rn] [reagent.core :as reagent] [clojure.string :as string] diff --git a/src/react_native/safe_area.cljs b/src/react_native/safe_area.cljs new file mode 100644 index 0000000000..706d0cb2ad --- /dev/null +++ b/src/react_native/safe_area.cljs @@ -0,0 +1,12 @@ +(ns react-native.safe-area + (:require ["react-native-safe-area-context" :as safe-area-context + :refer (SafeAreaInsetsContext)] + [reagent.core :as reagent])) + +(def ^:private consumer-raw (reagent/adapt-react-class (.-Consumer ^js SafeAreaInsetsContext))) + +(defn consumer [component] + [consumer-raw + (fn [insets] + (reagent/as-element + [component (js->clj insets :keywordize-keys true)]))]) diff --git a/src/status_im/switcher/animation.cljs b/src/status_im/switcher/animation.cljs index e246dcbab6..ca3c61c241 100644 --- a/src/status_im/switcher/animation.cljs +++ b/src/status_im/switcher/animation.cljs @@ -1,6 +1,6 @@ (ns status-im.switcher.animation (:require [re-frame.core :as re-frame] - [quo2.reanimated :as reanimated] + [react-native.reanimated :as reanimated] [quo2.foundations.colors :as colors] [status-im.async-storage.core :as async-storage] [status-im.switcher.constants :as constants])) diff --git a/src/status_im/switcher/home_stack.cljs b/src/status_im/switcher/home_stack.cljs index cfb1c424cf..5d997d0116 100644 --- a/src/status_im/switcher/home_stack.cljs +++ b/src/status_im/switcher/home_stack.cljs @@ -1,5 +1,5 @@ (ns status-im.switcher.home-stack - (:require [quo2.reanimated :as reanimated] + (:require [react-native.reanimated :as reanimated] [status-im.switcher.styles :as styles] [status-im.switcher.animation :as animation] [status-im.switcher.constants :as constants] diff --git a/src/status_im/theme/core.cljs b/src/status_im/theme/core.cljs index 28daef6afa..86fd2115f1 100644 --- a/src/status_im/theme/core.cljs +++ b/src/status_im/theme/core.cljs @@ -1,5 +1,7 @@ (ns status-im.theme.core - (:require [quo.theme :as quo-theme])) + (:require [quo.theme :as quo.theme] + [quo2.theme :as quo2.theme])) (defn change-theme [theme] - (quo-theme/set-theme theme)) + (quo.theme/set-theme theme) + (quo2.theme/set-theme theme)) diff --git a/src/status_im/ui2/screens/chat/composer/mentions.cljs b/src/status_im/ui2/screens/chat/composer/mentions.cljs index db0fd8cd66..eb0a7ef595 100644 --- a/src/status_im/ui2/screens/chat/composer/mentions.cljs +++ b/src/status_im/ui2/screens/chat/composer/mentions.cljs @@ -1,5 +1,5 @@ (ns status-im.ui2.screens.chat.composer.mentions - (:require [quo2.reanimated :as reanimated] + (:require [react-native.reanimated :as reanimated] [status-im.ui.components.list.views :as list] [quo.components.list.item :as list-item] [status-im.ui.screens.chat.photos :as photos] diff --git a/src/status_im/ui2/screens/chat/composer/view.cljs b/src/status_im/ui2/screens/chat/composer/view.cljs index c989d9f7f1..95677153b3 100644 --- a/src/status_im/ui2/screens/chat/composer/view.cljs +++ b/src/status_im/ui2/screens/chat/composer/view.cljs @@ -1,6 +1,6 @@ (ns status-im.ui2.screens.chat.composer.view - (:require [quo2.gesture :as gesture] - [quo2.reanimated :as reanimated] + (:require [react-native.gesture :as gesture] + [react-native.reanimated :as reanimated] [re-frame.core :as re-frame] [quo.components.safe-area :as safe-area] [quo.react-native :as rn] diff --git a/src/status_im/ui2/screens/chat/messages/pinned_message.cljs b/src/status_im/ui2/screens/chat/messages/pinned_message.cljs index 52849dc023..c03f959fcf 100644 --- a/src/status_im/ui2/screens/chat/messages/pinned_message.cljs +++ b/src/status_im/ui2/screens/chat/messages/pinned_message.cljs @@ -1,7 +1,7 @@ (ns status-im.ui2.screens.chat.messages.pinned-message (:require [status-im.i18n.i18n :as i18n] [quo.react :as react] - [quo2.reanimated :as reanimated] + [react-native.reanimated :as reanimated] [quo.react-native :as rn] [quo2.foundations.typography :as typography] [quo2.foundations.colors :as colors]