parent
14a5edb24b
commit
2ae57f7b21
|
@ -44,7 +44,7 @@
|
|||
(+ 50 keyboard-height-android-delta) ;; TODO : remove 50 when react-native-navigation v8 will be implemented https://github.com/wix/react-native-navigation/issues/7225
|
||||
0))
|
||||
min-height (+ (* styles/vertical-padding 2) (:bottom safe-area))
|
||||
max-height (- window-height (:top safe-area) styles/margin-top)
|
||||
max-height (- window-height (:top safe-area))
|
||||
visible (react/state false)
|
||||
|
||||
master-translation-y (animated/use-value 0)
|
||||
|
@ -202,17 +202,15 @@
|
|||
:wait-for master-ref
|
||||
:enabled (and (not disable-drag?)
|
||||
(not= sheet-height max-height))})
|
||||
[animated/view {:height sheet-height}
|
||||
[animated/scroll-view {:bounces false
|
||||
:flex 1
|
||||
:scroll-enabled (= sheet-height max-height)}
|
||||
[animated/view {:style {:padding-top styles/vertical-padding
|
||||
:padding-bottom (+ styles/vertical-padding
|
||||
(if (and platform/ios? keyboard-shown)
|
||||
keyboard-height
|
||||
(:bottom safe-area)))}
|
||||
:on-layout #(reset! height (.-nativeEvent.layout.height ^js %))}
|
||||
(into [:<>]
|
||||
(react/get-children children))]]]]]])))
|
||||
[animated/view {:height sheet-height
|
||||
:flex 1}
|
||||
[animated/view {:style {:padding-top styles/vertical-padding
|
||||
:padding-bottom (+ styles/vertical-padding
|
||||
(if (and platform/ios? keyboard-shown)
|
||||
keyboard-height
|
||||
(:bottom safe-area)))}
|
||||
:on-layout #(reset! height (.-nativeEvent.layout.height ^js %))}
|
||||
(into [:<>]
|
||||
(react/get-children children))]]]]])))
|
||||
|
||||
(def bottom-sheet (reagent/adapt-react-class (react/memo bottom-sheet-hooks)))
|
||||
(def bottom-sheet (reagent/adapt-react-class (react/memo bottom-sheet-hooks)))
|
||||
|
|
|
@ -0,0 +1,94 @@
|
|||
(ns quo2.components.community.discover-card
|
||||
(:require [quo2.components.markdown.text :as text]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[status-im.ui.screens.communities.styles :as styles]
|
||||
[status-im.ui.components.react :as react]))
|
||||
|
||||
;; Discover card placeholders images.
|
||||
;; TODO replaced when real data is available
|
||||
(def images
|
||||
{:images [{:id 1 :column-images [{:id 1 :image ""}]}
|
||||
{:id 2 :column-images [{}]}]})
|
||||
|
||||
(defn card-title-and-description [title description]
|
||||
[react/view
|
||||
{:flex 1
|
||||
:padding-top 8
|
||||
:padding-bottom 8
|
||||
:border-radius 12}
|
||||
[react/view {:flex 1
|
||||
:padding-horizontal 12}
|
||||
[text/text {:accessibility-label :community-name-text
|
||||
:ellipsize-mode :tail
|
||||
:number-of-lines 1
|
||||
:weight :semi-bold
|
||||
:size :paragraph-1}
|
||||
title]
|
||||
[text/text {:accessibility-label :community-name-text
|
||||
:ellipsize-mode :tail
|
||||
:number-of-lines 1
|
||||
:color (colors/theme-colors
|
||||
colors/neutral-50
|
||||
colors/neutral-40)
|
||||
:weight :regular
|
||||
:size :paragraph-2}
|
||||
description]]])
|
||||
|
||||
(defn placeholder-list-images [{:keys [images width height border-radius]}]
|
||||
[react/view
|
||||
[react/view {:justify-content :center}
|
||||
(for [{:keys [id]} images]
|
||||
^{:key id}
|
||||
[react/view {:border-radius border-radius
|
||||
:margin-top 4
|
||||
:margin-right 4
|
||||
:width width
|
||||
:height height
|
||||
:background-color colors/neutral-10}])]])
|
||||
|
||||
(defn placeholder-row-images [{:keys [first-image last-image images width height
|
||||
border-radius]}]
|
||||
[react/view
|
||||
(when first-image
|
||||
[react/view {:border-bottom-right-radius 6
|
||||
:border-bottom-left-radius 6
|
||||
:margin-right 4
|
||||
:width width
|
||||
:height height
|
||||
:background-color colors/neutral-10}])
|
||||
(when images
|
||||
[placeholder-list-images {:images images
|
||||
:width 32
|
||||
:height 32
|
||||
:border-radius 6}])
|
||||
(when last-image
|
||||
[react/view {:border-top-left-radius border-radius
|
||||
:border-top-right-radius 6
|
||||
:margin-top 4
|
||||
:width width
|
||||
:height height
|
||||
:background-color colors/neutral-10}])])
|
||||
|
||||
(defn discover-card [{:keys [title description on-press]}]
|
||||
(let [on-joined-images (get images :images)]
|
||||
[react/touchable-without-feedback
|
||||
{:on-press on-press}
|
||||
[react/view (merge (styles/community-card 16)
|
||||
{:background-color (colors/theme-colors
|
||||
colors/white
|
||||
colors/neutral-90)}
|
||||
{:flex-direction :row
|
||||
:margin-horizontal 20
|
||||
:height 56
|
||||
:padding-right 12})
|
||||
[card-title-and-description title description]
|
||||
(for [{:keys [id column-images]} on-joined-images]
|
||||
^{:key id}
|
||||
[placeholder-row-images {:images (when (= id 1)
|
||||
column-images)
|
||||
:width 32
|
||||
:height (if (= id 1) 8 26)
|
||||
:border-radius 6
|
||||
:first-image "" ; TODO replace with real data
|
||||
:last-image ""}]) ; TODO replace with real data
|
||||
]]))
|
|
@ -0,0 +1,84 @@
|
|||
(ns quo2.components.list-items.received-contact-request
|
||||
(:require [quo.react-native :as rn]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[status-im.utils.handlers :refer [<sub >evt]]
|
||||
[quo2.components.avatars.user-avatar :as user-avatar]
|
||||
[quo2.foundations.typography :as typography]
|
||||
[clojure.string :as str]
|
||||
[status-im.utils.utils :as utils.utils]
|
||||
[status-im.utils.datetime :as time]
|
||||
[status-im.i18n.i18n :as i18n]
|
||||
[quo2.components.notifications.notification-dot :refer [notification-dot]]))
|
||||
|
||||
(defn get-display-name [chat-id no-ens-name no-nickname]
|
||||
(let [name (first (<sub [:contacts/contact-two-names-by-identity chat-id]))]
|
||||
(if (and no-ens-name no-nickname)
|
||||
(let [[word1 word2] (str/split name " ")]
|
||||
(str word1 " " word2))
|
||||
name)))
|
||||
|
||||
(defn list-item [{:keys [chat-id image contact message timestamp read]}]
|
||||
(let [no-ens-name (str/blank? (get-in message [:content :ens-name]))
|
||||
no-nickname (nil? (get-in contact [:names :nickname]))
|
||||
display-name (get-display-name chat-id no-ens-name no-nickname)]
|
||||
[rn/view {:style {:flex-direction :row
|
||||
:padding-top 8
|
||||
:margin-top 4
|
||||
:padding-bottom 12
|
||||
:flex 1}}
|
||||
(when-not read
|
||||
[notification-dot {:right 32 :top 16}])
|
||||
[user-avatar/user-avatar {:full-name display-name
|
||||
:status-indicator? true
|
||||
:online? true
|
||||
:size :small
|
||||
:profile-picture image
|
||||
:ring? false}]
|
||||
[rn/view {:style {:margin-horizontal 8}}
|
||||
[rn/view {:style {:flex-direction :row}}
|
||||
[rn/text {:style (merge typography/font-semi-bold typography/paragraph-1
|
||||
{:color (colors/theme-colors :black :white)
|
||||
:margin-right 8})} display-name]
|
||||
(when no-ens-name [rn/text {:style (merge typography/font-regular typography/label
|
||||
{:color (colors/theme-colors colors/neutral-50 colors/neutral-40)
|
||||
:margin-top 4})}
|
||||
(str (utils.utils/get-shortened-address chat-id) " · ")])
|
||||
[rn/text {:style (merge typography/font-regular typography/label
|
||||
{:color (colors/theme-colors colors/neutral-50 colors/neutral-40)
|
||||
:margin-top 4})}
|
||||
(time/to-short-str timestamp)]]
|
||||
[rn/view {:style {:border-radius 12
|
||||
:margin-top 10
|
||||
:padding-horizontal 12
|
||||
:padding-vertical 8
|
||||
:border-width 1
|
||||
:border-color (colors/theme-colors colors/neutral-20 colors/neutral-70)}}
|
||||
[rn/text {:style (merge typography/font-regular
|
||||
typography/paragraph-1
|
||||
{:color (colors/theme-colors :black :white)})}
|
||||
(:text (:content message))]]
|
||||
[rn/view {:style {:margin-top 12
|
||||
:flex-direction :row}}
|
||||
[rn/touchable-opacity {:accessibility-label :decline-cr
|
||||
:on-press #(>evt [:contact-requests.ui/decline-request (:message-id message)])
|
||||
:active-opacity 1
|
||||
:style {:background-color (colors/theme-colors colors/danger-50 colors/danger-60)
|
||||
:justify-content :center
|
||||
:align-items :center
|
||||
:align-self :flex-start
|
||||
:border-radius 8
|
||||
:padding-vertical 4
|
||||
:padding-horizontal 8}}
|
||||
[rn/text {:style (merge typography/font-medium typography/paragraph-2 {:color :white})} (i18n/label :t/decline)]]
|
||||
[rn/touchable-opacity {:accessibility-label :accept-cr
|
||||
:on-press #(>evt [:contact-requests.ui/accept-request (:message-id message)])
|
||||
:active-opacity 1
|
||||
:style {:background-color (colors/theme-colors colors/success-50 colors/success-60)
|
||||
:justify-content :center
|
||||
:align-items :center
|
||||
:align-self :flex-start
|
||||
:border-radius 8
|
||||
:padding-vertical 4
|
||||
:padding-horizontal 8
|
||||
:margin-left 8}}
|
||||
[rn/text {:style (merge typography/font-medium typography/paragraph-2 {:color :white})} (i18n/label :t/accept)]]]]]))
|
|
@ -0,0 +1,12 @@
|
|||
(ns quo2.components.notifications.notification-dot
|
||||
(:require [quo.react-native :as rn]
|
||||
[quo2.foundations.colors :as colors]))
|
||||
|
||||
(defn notification-dot [style]
|
||||
[rn/view {:style (merge {:background-color (colors/theme-colors colors/primary-50 colors/primary-60)
|
||||
:width 8
|
||||
:height 8
|
||||
:border-radius 4
|
||||
:position :absolute
|
||||
:z-index 1}
|
||||
style)}])
|
|
@ -5,7 +5,9 @@
|
|||
[reagent.core :as reagent]
|
||||
[status-im.ui.components.react :as react]
|
||||
[status-im.utils.core :as utils]
|
||||
[status-im.utils.number :as number-utils]))
|
||||
[status-im.utils.number :as number-utils]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[quo2.components.notifications.notification-dot :refer [notification-dot]]))
|
||||
|
||||
(def default-tab-size 32)
|
||||
|
||||
|
@ -14,9 +16,21 @@
|
|||
(fn [{:keys [data size] :or {size default-tab-size}}]
|
||||
[rn/view (merge {:flex-direction :row} style)
|
||||
(doall
|
||||
(for [{:keys [label id]} data]
|
||||
(for [{:keys [label id new-info]} data]
|
||||
^{:key id}
|
||||
[rn/view {:style {:margin-right (if (= size default-tab-size) 12 8)}}
|
||||
(when new-info
|
||||
[rn/view {:position :absolute
|
||||
:z-index 1
|
||||
:right -2
|
||||
:top -2
|
||||
:width 10
|
||||
:height 10
|
||||
:border-radius 5
|
||||
:justify-content :center
|
||||
:align-items :center
|
||||
:background-color (colors/theme-colors colors/neutral-5 colors/neutral-95)}
|
||||
[notification-dot]])
|
||||
[tab/tab
|
||||
{:id id
|
||||
:size size
|
||||
|
@ -132,15 +146,15 @@
|
|||
[tab/tab {:id id
|
||||
:size size
|
||||
:override-theme override-theme
|
||||
:blur? blur?
|
||||
:active (= id @active-tab-id)
|
||||
:on-press (fn [id]
|
||||
(reset! active-tab-id id)
|
||||
(when scroll-on-press?
|
||||
(.scrollToIndex @flat-list-ref
|
||||
#js {:animated true
|
||||
:index index
|
||||
:viewPosition 0.5}))
|
||||
(when on-change
|
||||
(on-change id)))}
|
||||
:blur? blur?
|
||||
:active (= id @active-tab-id)
|
||||
:on-press (fn [id]
|
||||
(reset! active-tab-id id)
|
||||
(when scroll-on-press?
|
||||
(.scrollToIndex @flat-list-ref
|
||||
#js {:animated true
|
||||
:index index
|
||||
:viewPosition 0.5}))
|
||||
(when on-change
|
||||
(on-change id)))}
|
||||
label]])})])))))
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
[status-im.ui.components.react :as react]
|
||||
[status-im.ui.screens.home.styles :as styles]
|
||||
[status-im.ui.screens.home.views.inner-item :refer [home-list-item]]
|
||||
[quo.design-system.colors :as colors]
|
||||
[quo.design-system.colors :as quo.colors]
|
||||
[quo.core :as quo]
|
||||
[quo.platform :as platform]
|
||||
[status-im.add-new.core :as new-chat]
|
||||
|
@ -22,32 +22,37 @@
|
|||
[status-im.ui.screens.chat.sheets :as sheets]
|
||||
[status-im.ui.components.tabbar.core :as tabbar]
|
||||
[status-im.ui.components.invite.views :as invite]
|
||||
[status-im.utils.handlers :refer [<sub]]
|
||||
[status-im.utils.handlers :refer [<sub >evt]]
|
||||
[status-im.utils.config :as config]
|
||||
[quo2.components.markdown.text :as quo2.text]
|
||||
[status-im.qr-scanner.core :as qr-scanner]
|
||||
[status-im.ui.components.chat-icon.styles :as chat-icon.styles]
|
||||
[quo.react-native :as rn]
|
||||
[quo2.foundations.colors :as quo2.colors]
|
||||
[quo.react]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[quo2.foundations.typography :as typography]
|
||||
[quo2.components.buttons.button :as quo2.button]
|
||||
[quo2.components.tabs.tabs :as quo2.tabs]
|
||||
[quo2.components.community.discover-card :as discover-card]
|
||||
[status-im.multiaccounts.core :as multiaccounts]
|
||||
[status-im.ui.components.chat-icon.screen :as chat-icon])
|
||||
[status-im.ui.components.chat-icon.screen :as chat-icon]
|
||||
[quo2.components.icon :as quo2.icons]
|
||||
[quo.components.safe-area :as safe-area]
|
||||
[quo2.components.list-items.received-contact-request :as received-contact-request])
|
||||
(:require-macros [status-im.utils.views :as views]))
|
||||
|
||||
(defn home-tooltip-view []
|
||||
[rn/view (styles/chat-tooltip)
|
||||
[rn/view {:style {:width 66 :position :absolute :top -6 :background-color colors/white
|
||||
[rn/view {:style {:width 66 :position :absolute :top -6 :background-color quo.colors/white
|
||||
:align-items :center}}
|
||||
[rn/image {:source (resources/get-image :empty-chats-header)
|
||||
:style {:width 50 :height 50}}]]
|
||||
[rn/touchable-highlight
|
||||
{:style {:position :absolute :right 0 :top 0
|
||||
:width 44 :height 44 :align-items :center :justify-content :center}
|
||||
{:style {:position :absolute :right 0 :top 0
|
||||
:width 44 :height 44 :align-items :center :justify-content :center}
|
||||
:on-press #(re-frame/dispatch [:multiaccounts.ui/hide-home-tooltip])
|
||||
:accessibility-label :hide-home-button}
|
||||
[icons/icon :main-icons/close-circle {:color colors/gray}]]
|
||||
[icons/icon :main-icons/close-circle {:color quo.colors/gray}]]
|
||||
[react/i18n-text {:style styles/no-chats-text :key :chat-and-transact}]
|
||||
[rn/view {:align-items :center
|
||||
:margin-top 8
|
||||
|
@ -131,21 +136,21 @@
|
|||
row (assoc row :chat-id public-key)]
|
||||
|
||||
[quo/list-item
|
||||
{:title first-name
|
||||
:subtitle second-name
|
||||
:background-color quo2.colors/neutral-5
|
||||
:on-press (fn []
|
||||
(re-frame/dispatch [:dismiss-keyboard])
|
||||
(if platform/android?
|
||||
(re-frame/dispatch [:chat.ui/navigate-to-chat-nav2 public-key])
|
||||
(re-frame/dispatch [:chat.ui/navigate-to-chat public-key]))
|
||||
(re-frame/dispatch [:search/home-filter-changed nil])
|
||||
(re-frame/dispatch [:accept-all-activity-center-notifications-from-chat public-key]))
|
||||
:on-long-press #(re-frame/dispatch [:bottom-sheet/show-sheet
|
||||
{:content (fn []
|
||||
[sheets/actions row])}])
|
||||
:icon [chat-icon/contact-icon-contacts-tab
|
||||
(multiaccounts/displayed-photo row)]}]))
|
||||
{:title first-name
|
||||
:subtitle second-name
|
||||
:background-color colors/neutral-5
|
||||
:on-press (fn []
|
||||
(re-frame/dispatch [:dismiss-keyboard])
|
||||
(if platform/android?
|
||||
(re-frame/dispatch [:chat.ui/navigate-to-chat-nav2 public-key])
|
||||
(re-frame/dispatch [:chat.ui/navigate-to-chat public-key]))
|
||||
(re-frame/dispatch [:search/home-filter-changed nil])
|
||||
(re-frame/dispatch [:accept-all-activity-center-notifications-from-chat public-key]))
|
||||
;:on-long-press #(re-frame/dispatch [:bottom-sheet/show-sheet TODO: new UI yet to be implemented
|
||||
; {:content (fn []
|
||||
; [sheets/actions row])}])
|
||||
:icon [chat-icon/contact-icon-contacts-tab
|
||||
(multiaccounts/displayed-photo row)]}]))
|
||||
|
||||
(defn chat-list-key-fn [item]
|
||||
(or (:chat-id item) (:public-key item) (:id item)))
|
||||
|
@ -171,17 +176,110 @@
|
|||
(vals @data)))
|
||||
|
||||
(defn contacts-section-header [{:keys [title]}]
|
||||
[rn/view {:style {:border-top-width 1 :border-top-color quo2.colors/neutral-20 :padding-vertical 8 :padding-horizontal 20 :margin-top 8}}
|
||||
[rn/text {:style (merge typography/font-medium typography/paragraph-2 {:color quo2.colors/neutral-50})} title]])
|
||||
[rn/view {:style {:border-top-width 1 :border-top-color colors/neutral-20 :padding-vertical 8 :padding-horizontal 20 :margin-top 8}}
|
||||
[rn/text {:style (merge typography/font-medium typography/paragraph-2 {:color colors/neutral-50})} title]])
|
||||
|
||||
(defn find-contact-requests [notifications]
|
||||
(let [received-requests (atom [])
|
||||
has-unread (atom false)]
|
||||
(doseq [i (range (count notifications))]
|
||||
(doseq [j (range (count (:data (nth notifications i))))]
|
||||
(when (= 1 (get-in (nth (:data (nth notifications i)) j) [:message :contact-request-state]))
|
||||
(swap! received-requests conj (nth (:data (nth notifications i)) j)))
|
||||
(when (= false (get-in (nth (:data (nth notifications i)) j) [:read]))
|
||||
(reset! has-unread true))))
|
||||
{:received-requests @received-requests :has-unread @has-unread}))
|
||||
|
||||
(def selected-requests-tab (reagent/atom :received))
|
||||
|
||||
(defn contact-requests-sheet []
|
||||
[:f>
|
||||
(fn []
|
||||
(let [{window-height :height} (rn/use-window-dimensions)
|
||||
safe-area (safe-area/use-safe-area)
|
||||
notifications (<sub [:activity.center/notifications-grouped-by-date])
|
||||
{received-requests :received-requests} (find-contact-requests notifications)
|
||||
sent-requests []]
|
||||
[rn/view {:style {:margin-left 20
|
||||
:height (- window-height (:top safe-area))}}
|
||||
[rn/touchable-opacity
|
||||
{:on-press #(>evt [:bottom-sheet/hide])
|
||||
:style
|
||||
{:background-color (colors/theme-colors colors/neutral-10 colors/neutral-80)
|
||||
:width 32
|
||||
:height 32
|
||||
:border-radius 10
|
||||
:justify-content :center
|
||||
:align-items :center
|
||||
:margin-bottom 24}}
|
||||
[quo2.icons/icon :main-icons2/close {:color (colors/theme-colors "#000000" "#ffffff")}]]
|
||||
[rn/text {:style (merge
|
||||
typography/heading-1
|
||||
typography/font-semi-bold
|
||||
{:color (colors/theme-colors "#000000" "#ffffff")})}
|
||||
(i18n/label :t/pending-requests)]
|
||||
[quo2.tabs/tabs
|
||||
{:style {:margin-top 12 :margin-bottom 20}
|
||||
:size 32
|
||||
:on-change #(reset! selected-requests-tab %)
|
||||
:default-active :received
|
||||
:data [{:id :received
|
||||
:label (i18n/label :t/received)}
|
||||
{:id :sent
|
||||
:label (i18n/label :t/sent)}]}]
|
||||
[list/flat-list
|
||||
{:key-fn :first
|
||||
:data (if (= @selected-requests-tab :received) received-requests sent-requests)
|
||||
:render-fn received-contact-request/list-item}]]))])
|
||||
|
||||
(defn contact-requests [count]
|
||||
[rn/touchable-opacity
|
||||
{:active-opacity 1
|
||||
:on-press #(do
|
||||
(>evt
|
||||
[:bottom-sheet/show-sheet
|
||||
{:content (fn [] [contact-requests-sheet])}])
|
||||
(>evt [:mark-all-activity-center-notifications-as-read]))
|
||||
:style {:flex-direction :row
|
||||
:margin 8
|
||||
:padding-horizontal 12
|
||||
:padding-vertical 8
|
||||
:align-items :center}}
|
||||
[rn/view {:style {:justify-content :center
|
||||
:align-items :center
|
||||
:width 32
|
||||
:height 32
|
||||
:border-radius 16
|
||||
:border-width 1
|
||||
:border-color (colors/theme-colors colors/neutral-20 colors/neutral-80)}}
|
||||
[quo2.icons/icon :main-icons2/pending-user {:color (colors/theme-colors colors/neutral-50 colors/neutral-40)}]]
|
||||
[rn/view {:style {:margin-left 8}}
|
||||
[rn/text {:style
|
||||
(merge typography/paragraph-1 typography/font-semi-bold {:color (colors/theme-colors "#000000" "#ffffff")})} (i18n/label :t/pending-requests)]
|
||||
[rn/text {:style (merge typography/paragraph-2 typography/font-regular {:color (colors/theme-colors colors/neutral-50 colors/neutral-40)})} "Alice, Pedro and 3 others"]]
|
||||
[rn/view {:style {:width 16
|
||||
:height 16
|
||||
:position :absolute
|
||||
:right 22
|
||||
:border-radius 6
|
||||
:background-color (colors/theme-colors colors/primary-50 colors/primary-60)}}
|
||||
[rn/text {:style (merge typography/font-medium typography/label {:color "#ffffff" :text-align :center})} count]]])
|
||||
|
||||
(defn chats []
|
||||
(let [{:keys [items search-filter]} (<sub [:home-items])
|
||||
current-active-tab @selected-tab
|
||||
items (prepare-items current-active-tab items)
|
||||
contacts (<sub [:contacts/active])
|
||||
contacts (prepare-contacts contacts)]
|
||||
items (prepare-items current-active-tab items)
|
||||
contacts (<sub [:contacts/active])
|
||||
contacts (prepare-contacts contacts)
|
||||
notifications (<sub [:activity.center/notifications-grouped-by-date])
|
||||
{requests :received-requests new-info :has-unread} (find-contact-requests notifications)]
|
||||
[rn/view {:style {:flex 1}}
|
||||
[quo2.tabs/tabs {:style {:margin-left 20 :margin-bottom 20} :size 32
|
||||
[discover-card/discover-card {:title (i18n/label :t/invite-friends-to-status)
|
||||
:description (i18n/label :t/share-invite-link)}]
|
||||
[quo2.tabs/tabs {:style {:margin-left 20
|
||||
:margin-bottom 20
|
||||
:margin-top 24}
|
||||
:size 32
|
||||
:on-change #(reset! selected-tab %)
|
||||
:default-active selected-tab
|
||||
:data [{:id :recent
|
||||
|
@ -189,7 +287,8 @@
|
|||
{:id :groups
|
||||
:label (i18n/label :t/groups)}
|
||||
{:id :contacts
|
||||
:label (i18n/label :t/contacts)}]}]
|
||||
:label (i18n/label :t/contacts)
|
||||
:new-info new-info}]}]
|
||||
(if (and (empty? items)
|
||||
(empty? search-filter)
|
||||
(not @search-active?))
|
||||
|
@ -202,12 +301,14 @@
|
|||
:keyboard-should-persist-taps :always
|
||||
:data items
|
||||
:render-fn render-fn}]
|
||||
[list/section-list
|
||||
{:key-fn :title
|
||||
:sticky-section-headers-enabled false
|
||||
:sections contacts
|
||||
:render-section-header-fn contacts-section-header
|
||||
:render-fn render-contact}]))]))
|
||||
[rn/view {:style {:flex 1}} (when (> (count requests) 0)
|
||||
[contact-requests (count requests)])
|
||||
[list/section-list
|
||||
{:key-fn :title
|
||||
:sticky-section-headers-enabled false
|
||||
:sections contacts
|
||||
:render-section-header-fn contacts-section-header
|
||||
:render-fn render-contact}]]))]))
|
||||
|
||||
(views/defview chats-list []
|
||||
(views/letsubs [loading? [:chats/loading?]]
|
||||
|
@ -221,81 +322,84 @@
|
|||
(views/defview plus-button []
|
||||
(views/letsubs [logging-in? [:multiaccounts/login]]
|
||||
[components.plus-button/plus-button
|
||||
{:on-press (when-not logging-in?
|
||||
#(re-frame/dispatch [:bottom-sheet/show-sheet :add-new {}]))
|
||||
:loading logging-in?
|
||||
{:on-press (when-not logging-in?
|
||||
#(re-frame/dispatch [:bottom-sheet/show-sheet :add-new {}]))
|
||||
:loading logging-in?
|
||||
:accessibility-label :new-chat-button}]))
|
||||
|
||||
(views/defview notifications-button []
|
||||
(views/letsubs [notif-count [:activity.center/notifications-count]]
|
||||
[rn/view
|
||||
[quo2.button/button {:type :grey
|
||||
:size 32
|
||||
:width 32
|
||||
:style {:margin-left 12}
|
||||
[quo2.button/button {:type :grey
|
||||
:size 32
|
||||
:width 32
|
||||
:style {:margin-left 12}
|
||||
:accessibility-label :notifications-button
|
||||
:on-press #(do
|
||||
(re-frame/dispatch [:mark-all-activity-center-notifications-as-read])
|
||||
(if config/new-activity-center-enabled?
|
||||
(re-frame/dispatch [:navigate-to :activity-center])
|
||||
(re-frame/dispatch [:navigate-to :notifications-center])))}
|
||||
[icons/icon :main-icons/notification2 {:color (quo2.colors/theme-colors quo2.colors/neutral-100 quo2.colors/white)}]]
|
||||
:on-press #(do
|
||||
(re-frame/dispatch [:mark-all-activity-center-notifications-as-read])
|
||||
(if config/new-activity-center-enabled?
|
||||
(re-frame/dispatch [:navigate-to :activity-center])
|
||||
(re-frame/dispatch [:navigate-to :notifications-center])))}
|
||||
[icons/icon :main-icons/notification2 {:color (colors/theme-colors colors/neutral-100 colors/white)}]]
|
||||
(when (pos? notif-count)
|
||||
[rn/view {:style (merge (styles/counter-public-container) {:top 5 :right 5})
|
||||
[rn/view {:style (merge (styles/counter-public-container) {:top 5 :right 5})
|
||||
:pointer-events :none}
|
||||
[rn/view {:style styles/counter-public
|
||||
:accessibility-label :notifications-unread-badge}]])]))
|
||||
|
||||
(defn qr-button []
|
||||
[quo2.button/button {:type :grey
|
||||
[quo2.button/button {:type :grey
|
||||
:accessibility-label "qr-button"
|
||||
:size 32
|
||||
:width 32
|
||||
:style {:margin-left 12}
|
||||
:on-press #(do
|
||||
(re-frame/dispatch [::qr-scanner/scan-code
|
||||
{:handler ::qr-scanner/on-scan-success}]))}
|
||||
[icons/icon :main-icons/qr2 {:color (quo2.colors/theme-colors quo2.colors/neutral-100 quo2.colors/white)}]])
|
||||
:size 32
|
||||
:width 32
|
||||
:style {:margin-left 12}
|
||||
:on-press #(do
|
||||
(re-frame/dispatch [::qr-scanner/scan-code
|
||||
{:handler ::qr-scanner/on-scan-success}]))}
|
||||
[icons/icon :main-icons/qr2 {:color (colors/theme-colors colors/neutral-100 colors/white)}]])
|
||||
|
||||
(defn scan-button []
|
||||
[quo2.button/button {:type :grey
|
||||
:size 32
|
||||
:width 32
|
||||
[quo2.button/button {:type :grey
|
||||
:size 32
|
||||
:width 32
|
||||
:accessibility-label "scan-button"
|
||||
:on-press #(do
|
||||
(re-frame/dispatch [::qr-scanner/scan-code
|
||||
{:handler ::qr-scanner/on-scan-success}]))}
|
||||
[icons/icon :main-icons/scan2 {:color (quo2.colors/theme-colors quo2.colors/neutral-100 quo2.colors/white)}]])
|
||||
:on-press #(do
|
||||
(re-frame/dispatch [::qr-scanner/scan-code
|
||||
{:handler ::qr-scanner/on-scan-success}]))}
|
||||
[icons/icon :main-icons/scan2 {:color (colors/theme-colors colors/neutral-100 colors/white)}]])
|
||||
|
||||
(views/defview profile-button []
|
||||
(views/letsubs [{:keys [public-key preferred-name emoji]} [:multiaccount]]
|
||||
[rn/view
|
||||
[chat-icon/emoji-chat-icon-view public-key false preferred-name emoji
|
||||
{:size 28
|
||||
:chat-icon chat-icon.styles/chat-icon-chat-list}]]))
|
||||
{:size 28
|
||||
:chat-icon chat-icon.styles/chat-icon-chat-list}]]))
|
||||
|
||||
(defn home []
|
||||
[rn/keyboard-avoiding-view {:style {:flex 1
|
||||
:background-color (quo2.colors/theme-colors quo2.colors/neutral-5 quo2.colors/neutral-95)}
|
||||
:ignore-offset true}
|
||||
[topbar/topbar {:navigation :none
|
||||
:use-insets true
|
||||
:background (quo2.colors/theme-colors quo2.colors/neutral-5 quo2.colors/neutral-95)
|
||||
:left-component [rn/view {:flex-direction :row :margin-left 20}
|
||||
[profile-button]]
|
||||
:right-component [rn/view {:flex-direction :row :margin-right 20}
|
||||
[scan-button]
|
||||
[qr-button]
|
||||
[notifications-button]]
|
||||
:border-bottom false}]
|
||||
[rn/view {:flex-direction :row
|
||||
:justify-content :space-between
|
||||
:align-items :center
|
||||
:margin-horizontal 20
|
||||
:margin-top 15
|
||||
:margin-bottom 8}
|
||||
[quo2.text/text {:size :heading-1 :weight :semi-bold} (i18n/label :t/messages)]
|
||||
[plus-button]]
|
||||
[chats-list]
|
||||
[tabbar/tabs-counts-subscriptions]])
|
||||
[:f>
|
||||
(fn []
|
||||
(quo.react/effect! #(re-frame/dispatch [:get-activity-center-notifications]))
|
||||
[rn/keyboard-avoiding-view {:style {:flex 1
|
||||
:background-color (colors/theme-colors colors/neutral-5 colors/neutral-95)}
|
||||
:ignore-offset true}
|
||||
[topbar/topbar {:navigation :none
|
||||
:use-insets true
|
||||
:background (colors/theme-colors colors/neutral-5 colors/neutral-95)
|
||||
:left-component [rn/view {:flex-direction :row :margin-left 20}
|
||||
[profile-button]]
|
||||
:right-component [rn/view {:flex-direction :row :margin-right 20}
|
||||
[scan-button]
|
||||
[qr-button]
|
||||
[notifications-button]]
|
||||
:border-bottom false}]
|
||||
[rn/view {:flex-direction :row
|
||||
:justify-content :space-between
|
||||
:align-items :center
|
||||
:margin-horizontal 20
|
||||
:margin-top 15
|
||||
:margin-bottom 20}
|
||||
[quo2.text/text {:size :heading-1 :weight :semi-bold} (i18n/label :t/messages)]
|
||||
[plus-button]]
|
||||
[chats-list]
|
||||
[tabbar/tabs-counts-subscriptions]])])
|
||||
|
||||
|
|
|
@ -82,7 +82,7 @@
|
|||
and adds unicode ellipsis in between"
|
||||
[address]
|
||||
(when address
|
||||
(str (subs address 0 6) "\u2026" (subs address (- (count address) 4) (count address)))))
|
||||
(str (subs address 0 6) "\u2026" (subs address (- (count address) 3) (count address)))))
|
||||
|
||||
(defn get-shortened-checksum-address [address]
|
||||
(when address
|
||||
|
|
|
@ -1775,7 +1775,7 @@
|
|||
"new-ui": "New UI",
|
||||
"send-contact-request-message": "To start a chat you need to become contacts",
|
||||
"contact-request": "Contact request",
|
||||
"contact-requests": "Contact Requests",
|
||||
"contact-requests": "Contact requests",
|
||||
"say-hi": "Say hi",
|
||||
"opened": "Opened",
|
||||
"accepted": "Accepted",
|
||||
|
@ -1824,5 +1824,10 @@
|
|||
"blank-messages-text": "Your messages will be here",
|
||||
"groups": "Groups",
|
||||
"shell-placeholder-title": "Your apps will run here",
|
||||
"shell-placeholder-subtitle": "Open tabs of your communities, messages,\nwallet account and browser windows"
|
||||
"shell-placeholder-subtitle": "Open tabs of your communities, messages,\nwallet account and browser windows",
|
||||
"invite-friends-to-status": "Invite friends to status",
|
||||
"share-invite-link": "Share an invite link",
|
||||
"pending-requests": "Pending requests",
|
||||
"received": "Received",
|
||||
"sent": "Sent"
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue