Update communities discover screen

* Fix: discover communities missing data

* made community tags scrollable
This commit is contained in:
John Ngei 2023-03-31 13:25:56 +03:00 committed by GitHub
parent 2ab491f12b
commit abe4dc7ac1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 36 additions and 30 deletions

View File

@ -16,15 +16,13 @@
:height 230
:border-radius 20}
:on-press on-press}
[rn/view
{:flex 1}
[rn/view {:style style/detail-container}
[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]]
@ -38,7 +36,7 @@
{:title name
:description description}]
[rn/view {:style (style/card-stats-position)}
[community-view/community-stats-column :card-view]]
[community-view/community-stats-column
{:type :card-view}]]
[rn/view {:style (style/community-tags-position)}
[community-view/community-tags tags]]]]]]])

View File

@ -46,7 +46,7 @@
(merge {:style {:height 56
:border-radius 16}}
props)
[rn/view {:flex 1}
[rn/view {:style style/detail-container}
[rn/view (style/list-info-container)
[community-icon/community-icon
{:images community-icon} 32]
@ -64,7 +64,8 @@
colors/neutral-40
colors/neutral-60))}}
name]
[community-view/community-stats-column :list-view]]
[community-view/community-stats-column
{:type :list-view}]]
(if (= status :gated)
[community-view/permission-tag-container
{:locked? locked?

View File

@ -5,6 +5,7 @@
[quo2.components.tags.permission-tag :as permission]
[quo2.components.tags.tag :as tag]
[quo2.foundations.colors :as colors]
[quo.gesture-handler :as gesture-handler] ;;TODO move to quo2
[react-native.core :as rn]))
(defn community-stats
@ -23,7 +24,7 @@
members-count]])
(defn community-stats-column
[type]
[{:keys [type]}]
(let [icon-color (colors/theme-colors colors/neutral-50 colors/neutral-40)]
[rn/view
(if (= type :card-view)
@ -41,7 +42,9 @@
(defn community-tags
[tags]
[rn/view (style/community-tags-container)
[gesture-handler/scroll-view
{:shows-horizontal-scroll-indicator false
:horizontal true}
(for [{:keys [name emoji]} tags]
^{:key name}
[rn/view {:margin-right 8}

View File

@ -22,6 +22,9 @@
colors/white
colors/neutral-90)})
(def detail-container
{:flex 1})
(defn stats-count-container
[]
{:flex-direction :row
@ -37,10 +40,6 @@
{:flex-direction :row
:align-items :center})
(defn community-tags-container
[]
{:flex-direction :row})
(defn card-stats-position
[]
{:position :absolute
@ -62,7 +61,7 @@
:bottom 0
:left 0
:right 0
:height 20
:border-radius 20
:padding-horizontal padding-horizontal
:border-top-right-radius 16
:border-top-left-radius 16

View File

@ -22,10 +22,11 @@
(def featured-list-container
{:flex-direction :row
:overflow :hidden
:margin-bottom 24
:margin-left 20
:padding-right 20})
:overflow :hidden})
(def flat-list-container
{:padding-bottom 24
:padding-horizontal 20})
(def other-communities-container
{:flex 1

View File

@ -4,12 +4,12 @@
[quo2.core :as quo]
[quo2.foundations.colors :as colors]
[react-native.core :as rn]
[react-native.platform :as platform]
[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]
[status-im2.contexts.communities.discover.style :as style]
[utils.re-frame :as rf]))
@ -22,7 +22,7 @@
:group [{:id 1
:token-icon (resources/get-mock-image :status-logo)}]}]}})
(defn render-fn
(defn community-list-item
[community-item _ _ {:keys [width view-type]}]
(let [item (merge community-item
(get mock-community-item-data :data))
@ -98,18 +98,20 @@
{:style style/featured-list-container
:on-layout #(swap! view-size
(fn []
(- (oops/oget % "nativeEvent.layout.width") 20)))}
(- (oops/oget % "nativeEvent.layout.width") 40)))}
(when-not (= @view-size 0)
[rn/flat-list
{:key-fn :id
:horizontal true
:keyboard-should-persist-taps :always
:shows-horizontal-scroll-indicator false
:nestedScrollEnabled true
:separator [rn/view {:width 12}]
:data communities
:render-fn render-fn
:render-fn community-list-item
:render-data {:width @view-size
:view-type view-type}}])])))
:view-type view-type}
:content-container-style style/flat-list-container}])])))
(defn discover-communities-header
[{:keys [featured-communities-count
@ -120,7 +122,7 @@
[screen-title]
[featured-communities-header featured-communities-count]
[featured-list featured-communities view-type]
[quo/separator]
[quo/separator {:style {:margin-horizontal 20}}]
[discover-communities-segments selected-tab false]])
(defn other-communities-list
@ -131,14 +133,16 @@
(let [community-id (when communities-ids item)
community (if communities
item
[rf/sub [:communities/home-item community-id]])]
(rf/sub [:communities/home-item community-id]))
cover {:uri (get-in (:images item) [:banner :uri])}]
[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))
(get mock-community-item-data :data)
{:cover cover})
#(rf/dispatch [:navigate-to :community-overview (:id community)])]
[quo/communities-list-view-item
{:on-press (fn []

View File

@ -83,7 +83,7 @@
(:labelled? @state))
:resource (if (= :emoji (:type @state))
(resources/get-image :music)
:main-icons2/placeholder)})]]]]])))
:i/placeholder)})]]]]])))
(defn preview-tag
[]
[rn/view