Compare commits
5
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
b2c2c40024 | ||
|
|
800fb647fd | ||
|
|
26b7c6c437 | ||
|
|
77f7adafe1 | ||
|
|
da81c852c5 |
@@ -16,13 +16,15 @@
|
||||
:height 230
|
||||
:border-radius 20}
|
||||
:on-press on-press}
|
||||
[rn/view {:flex 1}
|
||||
[rn/view
|
||||
{:flex 1}
|
||||
[rn/view (style/community-cover-container 60)
|
||||
[rn/image
|
||||
{:source cover
|
||||
:style {:flex 1
|
||||
:border-top-right-radius 20
|
||||
:border-top-left-radius 20}}]]
|
||||
:style
|
||||
{:flex 1
|
||||
:border-top-right-radius 20
|
||||
:border-top-left-radius 20}}]]
|
||||
[rn/view (style/card-view-content-container 12)
|
||||
[rn/view (style/card-view-chat-icon 48)
|
||||
[icon/community-icon {:images images} 48]]
|
||||
@@ -36,8 +38,7 @@
|
||||
{:title name
|
||||
:description description}]
|
||||
[rn/view {:style (style/card-stats-position)}
|
||||
[community-view/community-stats-column
|
||||
{:type :card-view}]]
|
||||
[community-view/community-stats-column :card-view]]
|
||||
[rn/view {:style (style/community-tags-position)}
|
||||
[community-view/community-tags tags]]]]]]])
|
||||
|
||||
|
||||
@@ -64,8 +64,7 @@
|
||||
colors/neutral-40
|
||||
colors/neutral-60))}}
|
||||
name]
|
||||
[community-view/community-stats-column
|
||||
{:type :list-view}]]
|
||||
[community-view/community-stats-column :list-view]]
|
||||
(if (= status :gated)
|
||||
[community-view/permission-tag-container
|
||||
{:locked? locked?
|
||||
|
||||
@@ -23,7 +23,7 @@
|
||||
members-count]])
|
||||
|
||||
(defn community-stats-column
|
||||
[{:keys [type]}]
|
||||
[type]
|
||||
(let [icon-color (colors/theme-colors colors/neutral-50 colors/neutral-40)]
|
||||
[rn/view
|
||||
(if (= type :card-view)
|
||||
@@ -46,12 +46,11 @@
|
||||
^{:key name}
|
||||
[rn/view {:margin-right 8}
|
||||
[tag/tag
|
||||
{:size 24
|
||||
:label name
|
||||
:type :emoji
|
||||
:labelled? true
|
||||
:scrollable? true
|
||||
:resource emoji}]])])
|
||||
{:size 24
|
||||
:label name
|
||||
:type :emoji
|
||||
:labelled? true
|
||||
:resource emoji}]])])
|
||||
|
||||
(defn community-title
|
||||
[{:keys [title description size] :or {size :small}}]
|
||||
|
||||
@@ -62,7 +62,7 @@
|
||||
:bottom 0
|
||||
:left 0
|
||||
:right 0
|
||||
:border-radius 20
|
||||
:height 20
|
||||
:padding-horizontal padding-horizontal
|
||||
:border-top-right-radius 16
|
||||
:border-top-left-radius 16
|
||||
|
||||
@@ -225,12 +225,8 @@
|
||||
|
||||
(defn format-members
|
||||
[count]
|
||||
(cond
|
||||
(> count 1000000)
|
||||
(if (> count 1000000)
|
||||
(str (with-precision (/ count 1000000) 1) (i18n/label :t/M))
|
||||
|
||||
(< 999 count 1000000)
|
||||
(str (with-precision (/ count 1000) 1) (i18n/label :t/K))
|
||||
|
||||
:else
|
||||
count))
|
||||
(if (and (> count 999) (< count 1000000))
|
||||
(str (with-precision (/ count 1000) 1) (i18n/label :t/K))
|
||||
count)))
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
[status-im.ui.screens.multiaccounts.key-storage.views :as key-storage]
|
||||
[status-im.ui.screens.multiaccounts.recover.views :as recover.views]
|
||||
[status-im2.common.bottom-sheet.view :as bottom-sheet]
|
||||
[status-im2.contexts.chat.messages.pin.list.view :as pin.list]
|
||||
[status-im2.contexts.chat.menus.pinned-messages.view :as pinned-messages-menu]
|
||||
[react-native.core :as rn]))
|
||||
|
||||
(defn bottom-sheet
|
||||
@@ -50,7 +50,8 @@
|
||||
(merge key-storage/migrate-account-password)
|
||||
|
||||
(= view :pinned-messages-list)
|
||||
(merge {:content pin.list/pinned-messages-list}))]
|
||||
(merge {:content pinned-messages-menu/pinned-messages
|
||||
:bottom-safe-area-spacing? false}))]
|
||||
[:f>
|
||||
(fn []
|
||||
(rn/use-effect (fn []
|
||||
|
||||
@@ -89,7 +89,7 @@
|
||||
|
||||
|
||||
(defn display-picture
|
||||
[scroll-height logo]
|
||||
[scroll-height cover]
|
||||
(let [input-range (if platform/ios? [-67 10] [0 150])
|
||||
y (reanimated/use-shared-value scroll-height)
|
||||
animation (reanimated/interpolate y
|
||||
@@ -104,7 +104,7 @@
|
||||
[reanimated/view
|
||||
{:style (style/display-picture-container animation)}
|
||||
[rn/image
|
||||
{:source logo
|
||||
{:source cover
|
||||
:style style/display-picture}]]))
|
||||
|
||||
(defn scroll-page
|
||||
@@ -117,7 +117,7 @@
|
||||
[:<>
|
||||
[:f> scroll-page-header @scroll-height height name page-nav-right-section-buttons
|
||||
logo sticky-header top-nav title-colum navigate-back?]
|
||||
[rn/flat-list
|
||||
[rn/scroll-view
|
||||
{:content-container-style (style/scroll-view-container
|
||||
(diff-with-max-min @scroll-height 16 0))
|
||||
:shows-vertical-scroll-indicator false
|
||||
@@ -128,25 +128,21 @@
|
||||
event
|
||||
"nativeEvent.contentOffset.y")))
|
||||
(when on-scroll
|
||||
(on-scroll @scroll-height)))
|
||||
:header [rn/view
|
||||
(when cover-image
|
||||
[rn/view {:style {:height 151}}
|
||||
[rn/image
|
||||
{:source cover-image
|
||||
;; Using negative margin-bottom as a workaround because
|
||||
;; on Android,
|
||||
;; ScrollView clips its children despite setting
|
||||
;; overflow: 'visible'.
|
||||
;; Related issue:
|
||||
;; https://github.com/facebook/react-native/issues/31218
|
||||
:style {:margin-bottom -16
|
||||
:flex 1}}]])
|
||||
(when children
|
||||
[rn/view
|
||||
{:flex 1
|
||||
:border-radius (diff-with-max-min @scroll-height 16 0)
|
||||
:background-color background-color}
|
||||
(when cover-image
|
||||
[:f> display-picture @scroll-height logo])
|
||||
children])]}]])))
|
||||
(on-scroll @scroll-height)))}
|
||||
(when cover-image
|
||||
[rn/view {:style {:height 151}}
|
||||
[rn/image
|
||||
{:source cover-image
|
||||
;; Using negative margin-bottom as a workaround because on Android,
|
||||
;; ScrollView clips its children despite setting overflow: 'visible'.
|
||||
;; Related issue: https://github.com/facebook/react-native/issues/31218
|
||||
:style {:margin-bottom -16
|
||||
:flex 1}}]])
|
||||
(when children
|
||||
[rn/view
|
||||
{:flex 1
|
||||
:border-radius (diff-with-max-min @scroll-height 16 0)
|
||||
:background-color background-color}
|
||||
(when cover-image
|
||||
[:f> display-picture @scroll-height logo])
|
||||
children])]])))
|
||||
|
||||
@@ -0,0 +1,43 @@
|
||||
(ns status-im2.contexts.chat.menus.pinned-messages.style
|
||||
(:require [quo2.foundations.colors :as colors]))
|
||||
|
||||
(def heading
|
||||
{:margin-horizontal 20})
|
||||
|
||||
(def heading-container
|
||||
{:flex-direction :row
|
||||
:background-color (colors/theme-colors colors/neutral-10 colors/neutral-80)
|
||||
:border-radius 20
|
||||
:align-items :center
|
||||
:align-self :flex-start
|
||||
:margin-horizontal 20
|
||||
:padding 4
|
||||
:margin-top 8})
|
||||
|
||||
(def heading-text
|
||||
{:margin-left 6
|
||||
:margin-right 4})
|
||||
|
||||
(def chat-name-text
|
||||
{:margin-left 4
|
||||
:margin-right 8})
|
||||
|
||||
(defn list-footer
|
||||
[bottom-inset]
|
||||
{:height bottom-inset})
|
||||
|
||||
(defn no-pinned-messages-container
|
||||
[bottom-inset]
|
||||
{:justify-content :center
|
||||
:align-items :center
|
||||
:margin-top 20
|
||||
:margin-bottom bottom-inset})
|
||||
|
||||
(def no-pinned-messages-icon
|
||||
{:width 120
|
||||
:height 120
|
||||
:justify-content :center
|
||||
:align-items :center})
|
||||
|
||||
(def no-pinned-messages-text
|
||||
{:margin-top 20})
|
||||
@@ -0,0 +1,72 @@
|
||||
(ns status-im2.contexts.chat.menus.pinned-messages.view
|
||||
(:require [quo2.core :as quo]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[react-native.core :as rn]
|
||||
[react-native.safe-area :as safe-area]
|
||||
[status-im2.contexts.chat.messages.content.deleted.view :as content.deleted]
|
||||
[status-im2.contexts.chat.messages.content.view :as message]
|
||||
[status-im2.contexts.chat.menus.pinned-messages.style :as style]
|
||||
[utils.i18n :as i18n]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
(def list-key-fn #(or (:message-id %) (:value %)))
|
||||
|
||||
(defn message-render-fn
|
||||
[{:keys [deleted? deleted-for-me?] :as message} _ _ context]
|
||||
;; TODO (flexsurfer) probably we don't want reactions here
|
||||
(if (or deleted? deleted-for-me?)
|
||||
[content.deleted/deleted-message message context]
|
||||
[message/message-with-reactions message context]))
|
||||
|
||||
(defn pinned-messages
|
||||
[chat-id]
|
||||
(let [pinned-messages (rf/sub [:chats/pinned-sorted-list chat-id])
|
||||
render-data (rf/sub [:chats/current-chat-message-list-view-context :in-pinned-view])
|
||||
{:keys [community-id]} (rf/sub [:chat-by-id chat-id])
|
||||
community (rf/sub [:communities/community community-id])]
|
||||
[safe-area/consumer
|
||||
(fn [insets]
|
||||
[:f>
|
||||
(fn []
|
||||
(let [{window-height :height} (rn/use-window-dimensions)
|
||||
bottom-inset (:bottom insets)]
|
||||
[rn/scroll-view
|
||||
{:style {:max-height (- window-height (:top insets))}
|
||||
:accessibility-label :pinned-messages-menu}
|
||||
[:<>
|
||||
[quo/text
|
||||
{:size :heading-1
|
||||
:weight :semi-bold
|
||||
:style style/heading}
|
||||
(i18n/label :t/pinned-messages)]
|
||||
(when community
|
||||
[rn/view
|
||||
{:style style/heading-container}
|
||||
[rn/text {:style style/heading-text} (:name community)]
|
||||
[quo/icon
|
||||
:i/chevron-right
|
||||
{:color (colors/theme-colors colors/neutral-50 colors/neutral-40)
|
||||
:size 12}]
|
||||
[rn/text
|
||||
{:style style/chat-name-text}
|
||||
(str "# " (:chat-name current-chat))]])]
|
||||
(if (pos? (count pinned-messages))
|
||||
[rn/flat-list
|
||||
{:data pinned-messages
|
||||
:render-data render-data
|
||||
:render-fn message-render-fn
|
||||
:footer [rn/view {:style (style/list-footer bottom-inset)}]
|
||||
:key-fn list-key-fn
|
||||
:separator quo/separator}]
|
||||
[rn/view {:style (style/no-pinned-messages-container bottom-inset)}
|
||||
[rn/view {:style style/no-pinned-messages-icon}
|
||||
[quo/icon :i/placeholder]]
|
||||
[quo/text
|
||||
{:weight :semi-bold
|
||||
:style style/no-pinned-messages-text}
|
||||
(i18n/label :t/no-pinned-messages)]
|
||||
[quo/text {:size :paragraph-2}
|
||||
(i18n/label
|
||||
(if community
|
||||
:t/no-pinned-messages-community-desc
|
||||
:t/no-pinned-messages-desc))]])]))])]))
|
||||
@@ -1,77 +0,0 @@
|
||||
(ns status-im2.contexts.chat.messages.pin.list.view
|
||||
(:require [quo2.core :as quo]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[react-native.core :as rn]
|
||||
[status-im2.contexts.chat.messages.content.deleted.view :as content.deleted]
|
||||
[status-im2.contexts.chat.messages.content.view :as message]
|
||||
[utils.i18n :as i18n]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
(def list-key-fn #(or (:message-id %) (:value %)))
|
||||
|
||||
(defn message-render-fn
|
||||
[{:keys [deleted? deleted-for-me?] :as message} _ _ context]
|
||||
;; TODO (flexsurfer) probably we don't want reactions here
|
||||
(if (or deleted? deleted-for-me?)
|
||||
[content.deleted/deleted-message message context]
|
||||
[message/message-with-reactions message context]))
|
||||
|
||||
(defn pinned-messages-list
|
||||
[chat-id]
|
||||
(let [pinned-messages (rf/sub [:chats/pinned-sorted-list chat-id])
|
||||
render-data (rf/sub [:chats/current-chat-message-list-view-context :in-pinned-view])
|
||||
current-chat (rf/sub [:chat-by-id chat-id])
|
||||
{:keys [community-id]} current-chat
|
||||
community (rf/sub [:communities/community community-id])]
|
||||
[rn/view {:accessibility-label :pinned-messages-list}
|
||||
;; TODO (flexsurfer) this should be a component in quo2
|
||||
;; https://github.com/status-im/status-mobile/issues/14529
|
||||
[:<>
|
||||
[quo/text
|
||||
{:size :heading-1
|
||||
:weight :semi-bold
|
||||
:style {:margin-horizontal 20}}
|
||||
(i18n/label :t/pinned-messages)]
|
||||
(when community
|
||||
[rn/view
|
||||
{:style {:flex-direction :row
|
||||
:background-color (colors/theme-colors colors/neutral-10 colors/neutral-80)
|
||||
:border-radius 20
|
||||
:align-items :center
|
||||
:align-self :flex-start
|
||||
:margin-horizontal 20
|
||||
:padding 4
|
||||
:margin-top 8}}
|
||||
[rn/text {:style {:margin-left 6 :margin-right 4}} (:name community)]
|
||||
[quo/icon
|
||||
:i/chevron-right
|
||||
{:color (colors/theme-colors colors/neutral-50 colors/neutral-40)
|
||||
:size 12}]
|
||||
[rn/text
|
||||
{:style {:margin-left 4
|
||||
:margin-right 8}}
|
||||
(str "# " (:chat-name current-chat))]])]
|
||||
(if (pos? (count pinned-messages))
|
||||
[rn/flat-list
|
||||
{:data pinned-messages
|
||||
:render-data render-data
|
||||
:render-fn message-render-fn
|
||||
:key-fn list-key-fn
|
||||
:separator quo/separator}]
|
||||
[rn/view
|
||||
{:style {:justify-content :center
|
||||
:align-items :center
|
||||
:margin-top 20}}
|
||||
[rn/view
|
||||
{:style {:width 120
|
||||
:height 120
|
||||
:justify-content :center
|
||||
:align-items :center
|
||||
:border-width 1}} [quo/icon :i/placeholder]]
|
||||
[quo/text
|
||||
{:weight :semi-bold
|
||||
:style {:margin-top 20}}
|
||||
(i18n/label :t/no-pinned-messages)]
|
||||
[quo/text {:size :paragraph-2}
|
||||
(i18n/label
|
||||
(if community :t/no-pinned-messages-community-desc :t/no-pinned-messages-desc))]])]))
|
||||
@@ -22,11 +22,10 @@
|
||||
|
||||
(def featured-list-container
|
||||
{:flex-direction :row
|
||||
:overflow :hidden})
|
||||
|
||||
(def flat-list-container
|
||||
{:padding-bottom 24
|
||||
:padding-horizontal 20})
|
||||
:overflow :hidden
|
||||
:margin-bottom 24
|
||||
:margin-left 20
|
||||
:padding-right 20})
|
||||
|
||||
(def other-communities-container
|
||||
{:flex 1
|
||||
|
||||
@@ -7,6 +7,7 @@
|
||||
[reagent.core :as reagent]
|
||||
[status-im2.common.resources :as resources]
|
||||
[status-im2.contexts.communities.menus.community-options.view :as options]
|
||||
[status-im.ui.screens.communities.community :as community]
|
||||
[status-im.ui.components.react :as react]
|
||||
[react-native.platform :as platform]
|
||||
[status-im2.common.scroll-page.view :as scroll-page]
|
||||
@@ -21,28 +22,23 @@
|
||||
:group [{:id 1
|
||||
:token-icon (resources/get-mock-image :status-logo)}]}]}})
|
||||
|
||||
(defn community-list-item
|
||||
[{:keys [id] :as community} _ _ {:keys [width view-type]}]
|
||||
(let [community-item (merge
|
||||
community
|
||||
(get mock-community-item-data :data))
|
||||
cover {:uri (get-in (:images community) [:banner :uri])}]
|
||||
(defn render-fn
|
||||
[community-item _ _ {:keys [width view-type]}]
|
||||
(let [item (merge community-item
|
||||
(get mock-community-item-data :data))
|
||||
cover {:uri (get-in (:images item) [:banner :uri])}]
|
||||
(if (= view-type :card-view)
|
||||
[quo/community-card-view-item (assoc community-item :width width :cover cover)
|
||||
#(rf/dispatch [:navigate-to :community-overview (:id community)])]
|
||||
[quo/community-card-view-item (assoc item :width width :cover cover)
|
||||
#(rf/dispatch [:navigate-to :community-overview (:id item)])]
|
||||
[quo/communities-list-view-item
|
||||
{:on-press (fn []
|
||||
(rf/dispatch [:communities/load-category-states id])
|
||||
(rf/dispatch [:communities/load-category-states (:id item)])
|
||||
(rf/dispatch [:dismiss-keyboard])
|
||||
<<<<<<< HEAD
|
||||
(rf/dispatch [:navigate-to :community-overview (:id item)]))
|
||||
=======
|
||||
(rf/dispatch [:navigate-to :community {:community-id id}]))
|
||||
>>>>>>> 1675fef63 (Fix: community data not displayed)
|
||||
:on-long-press #(rf/dispatch
|
||||
[:bottom-sheet/show-sheet
|
||||
{:content (fn []
|
||||
[options/community-options-bottom-sheet id])}])}])))
|
||||
[options/community-options-bottom-sheet (:id item)])}])}])))
|
||||
|
||||
(defn screen-title
|
||||
[]
|
||||
@@ -93,6 +89,7 @@
|
||||
:label (i18n/label :t/gated)
|
||||
:accessibility-label :gated-communities-tab}]}]])
|
||||
|
||||
|
||||
(defn featured-list
|
||||
[communities view-type]
|
||||
(let [view-size (reagent/atom 0)]
|
||||
@@ -101,7 +98,7 @@
|
||||
{:style style/featured-list-container
|
||||
:on-layout #(swap! view-size
|
||||
(fn []
|
||||
(- (oops/oget % "nativeEvent.layout.width") 40)))}
|
||||
(- (oops/oget % "nativeEvent.layout.width") 20)))}
|
||||
(when-not (= @view-size 0)
|
||||
[rn/flat-list
|
||||
{:key-fn :id
|
||||
@@ -110,22 +107,9 @@
|
||||
:shows-horizontal-scroll-indicator false
|
||||
:separator [rn/view {:width 12}]
|
||||
:data communities
|
||||
:render-fn community-list-item
|
||||
:render-fn render-fn
|
||||
:render-data {:width @view-size
|
||||
:view-type view-type}
|
||||
:contentContainerStyle style/flat-list-container}])])))
|
||||
|
||||
(defn other-communities-list
|
||||
[{:keys [communities view-type]}]
|
||||
[rn/view style/other-communities-container
|
||||
[rn/flat-list
|
||||
{:key-fn :id
|
||||
:keyboard-should-persist-taps :always
|
||||
:separator [rn/view {:height 16}]
|
||||
:data communities
|
||||
:render-fn community-list-item
|
||||
:contentContainerStyle style/flat-list-container
|
||||
:render-data {:view-type view-type}}]])
|
||||
:view-type view-type}}])])))
|
||||
|
||||
(defn discover-communities-header
|
||||
[{:keys [featured-communities-count
|
||||
@@ -136,10 +120,39 @@
|
||||
[screen-title]
|
||||
[featured-communities-header featured-communities-count]
|
||||
[featured-list featured-communities view-type]
|
||||
[rn/view {:style {:margin-horizontal 20}}
|
||||
[quo/separator]]
|
||||
[quo/separator]
|
||||
[discover-communities-segments selected-tab false]])
|
||||
|
||||
(defn other-communities-list
|
||||
[{:keys [communities communities-ids view-type]}]
|
||||
[rn/view {:style style/other-communities-container}
|
||||
(map-indexed
|
||||
(fn [inner-index item]
|
||||
(let [community-id (when communities-ids item)
|
||||
community (if communities
|
||||
item
|
||||
[rf/sub [:communities/home-item community-id]])]
|
||||
[rn/view
|
||||
{:key (str inner-index (:id community))
|
||||
:margin-bottom 16}
|
||||
(if (= view-type :card-view)
|
||||
[quo/community-card-view-item
|
||||
(merge community
|
||||
(get mock-community-item-data :data))
|
||||
#(rf/dispatch [:navigate-to :community-overview (:id community)])]
|
||||
[quo/communities-list-view-item
|
||||
{:on-press (fn []
|
||||
(rf/dispatch [:communities/load-category-states (:id community)])
|
||||
(rf/dispatch [:dismiss-keyboard])
|
||||
(rf/dispatch [:navigate-to :community-overview (:id community)]))
|
||||
:on-long-press #(rf/dispatch [:bottom-sheet/show-sheet
|
||||
{:content (fn []
|
||||
;; TODO implement with quo2
|
||||
[community/community-actions community])}])}
|
||||
(merge community
|
||||
(get mock-community-item-data :data))])]))
|
||||
(if communities communities communities-ids))])
|
||||
|
||||
(defn communities-lists
|
||||
[selected-tab view-type]
|
||||
[rn/view {:style {:flex 1}}
|
||||
|
||||
@@ -637,7 +637,7 @@ class UnpinMessagePopUp(BaseElement):
|
||||
|
||||
class PinnedMessagesList(BaseElement):
|
||||
def __init__(self, driver):
|
||||
super().__init__(driver, xpath="//*[@content-desc='pinned-messages-list']")
|
||||
super().__init__(driver, xpath="//*[@content-desc='pinned-messages-menu']")
|
||||
|
||||
def get_pinned_messages_number(self):
|
||||
self.driver.info("Getting number of pinned messages inside pinned messages list element")
|
||||
|
||||
Reference in New Issue
Block a user