parent
aca296030c
commit
8168d224d3
|
@ -1,48 +1,44 @@
|
|||
(ns quo2.components.community.community-card-view
|
||||
(:require
|
||||
[quo2.components.community.community-view :as community-view]
|
||||
[status-im.utils.handlers :refer [<sub]]
|
||||
[status-im.ui.components.react :as react]
|
||||
[status-im.ui.screens.communities.styles :as styles]
|
||||
[status-im.ui.screens.communities.icon :as communities.icon]))
|
||||
[quo2.components.community.style :as style]
|
||||
[react-native.core :as rn]))
|
||||
|
||||
;; TODO move this component to ui namespace, status-im or re-frame ns shouldn't be used in quo
|
||||
(defn community-card-view-item
|
||||
[{:keys [name description locked
|
||||
status tokens cover tags featured] :as community} on-press]
|
||||
(let [width (* (<sub [:dimensions/window-width]) 0.90)]
|
||||
[react/touchable-opacity {:on-press on-press}
|
||||
[react/view {:style (merge (styles/community-card 20)
|
||||
{:margin-bottom 16}
|
||||
(if featured
|
||||
{:margin-right 12
|
||||
:width width}
|
||||
{:flex 1
|
||||
:margin-horizontal 20}))}
|
||||
[react/view {:style {:height 230
|
||||
:border-radius 20}
|
||||
:on-press on-press}
|
||||
[react/view
|
||||
{:flex 1}
|
||||
[react/view (styles/community-cover-container 40)
|
||||
[react/image
|
||||
{:source cover
|
||||
:style
|
||||
{:flex 1
|
||||
:border-radius 20}}]]
|
||||
[react/view (styles/card-view-content-container 12)
|
||||
[react/view (styles/card-view-chat-icon 48)
|
||||
[communities.icon/community-icon-redesign community 48]]
|
||||
(when (= status :gated)
|
||||
[react/view (styles/permission-tag-styles)
|
||||
[community-view/permission-tag-container {:locked locked
|
||||
:status status
|
||||
:tokens tokens}]])
|
||||
[community-view/community-title
|
||||
{:title name
|
||||
:description description}]
|
||||
[react/view {:style (styles/card-stats-position)}
|
||||
[community-view/community-stats-column :card-view]]
|
||||
[react/view {:style (styles/community-tags-position)}
|
||||
[community-view/community-tags tags]]]]]]]))
|
||||
status tokens cover tags featured]} on-press]
|
||||
[rn/touchable-opacity {:on-press on-press}
|
||||
[rn/view {:style (merge (style/community-card 20)
|
||||
{:margin-bottom 16}
|
||||
(if featured
|
||||
{:margin-right 12}
|
||||
{:flex 1
|
||||
:margin-horizontal 20}))}
|
||||
[rn/view {:style {:height 230
|
||||
:border-radius 20}
|
||||
:on-press on-press}
|
||||
[rn/view
|
||||
{:flex 1}
|
||||
[rn/view (style/community-cover-container 40)
|
||||
[rn/image
|
||||
{:source cover
|
||||
:style
|
||||
{:flex 1
|
||||
:border-radius 20}}]]
|
||||
[rn/view (style/card-view-content-container 12)
|
||||
[rn/view (style/card-view-chat-icon 48)]
|
||||
;;TODO new pure component based on quo2 should be implemented without status-im usage
|
||||
;[communities.icon/community-icon-redesign community 48]]
|
||||
(when (= status :gated)
|
||||
[rn/view (style/permission-tag-styles)
|
||||
[community-view/permission-tag-container {:locked locked
|
||||
:status status
|
||||
:tokens tokens}]])
|
||||
[community-view/community-title
|
||||
{:title name
|
||||
:description description}]
|
||||
[rn/view {:style (style/card-stats-position)}
|
||||
[community-view/community-stats-column :card-view]]
|
||||
[rn/view {:style (style/community-tags-position)}
|
||||
[community-view/community-tags tags]]]]]]])
|
||||
|
||||
|
|
|
@ -5,93 +5,78 @@
|
|||
[quo2.foundations.colors :as colors]
|
||||
[quo2.components.counter.counter :as counter]
|
||||
[quo2.components.icon :as icons]
|
||||
[status-im.communities.core :as communities]
|
||||
[status-im.utils.handlers :refer [>evt]]
|
||||
[status-im.ui.components.react :as react]
|
||||
[status-im.ui.screens.communities.styles :as styles]
|
||||
[status-im.ui.screens.communities.community :as community]
|
||||
[status-im.ui.screens.communities.icon :as communities.icon]))
|
||||
[quo2.components.community.style :as style]
|
||||
[react-native.core :as rn]))
|
||||
|
||||
;; TODO move this component to ui namespace, status-im or re-frame ns shouldn't be used in quo
|
||||
(defn communities-list-view-item [{:keys [id name locked? status notifications
|
||||
tokens background-color] :as community}]
|
||||
[react/view {:style (merge (styles/community-card 16)
|
||||
{:margin-bottom 12
|
||||
:margin-horizontal 20})}
|
||||
[react/view {:style {:height 56
|
||||
:border-radius 16}
|
||||
:on-press (fn []
|
||||
(>evt [::communities/load-category-states id])
|
||||
(>evt [:dismiss-keyboard])
|
||||
(>evt [:navigate-to :community {:community-id id}]))
|
||||
:on-long-press #(>evt [:bottom-sheet/show-sheet
|
||||
{:content (fn []
|
||||
[community/community-actions community])}])}
|
||||
[react/view {:flex 1}
|
||||
[react/view {:flex-direction :row
|
||||
:border-radius 16
|
||||
:padding-horizontal 12
|
||||
:align-items :center
|
||||
:padding-vertical 8
|
||||
:background-color background-color}
|
||||
[react/view
|
||||
[communities.icon/community-icon-redesign community 32]]
|
||||
[react/view {:flex 1
|
||||
:margin-horizontal 12}
|
||||
(defn communities-list-view-item [props {:keys [name locked? status notifications
|
||||
tokens background-color]}]
|
||||
[rn/view {:style (merge (style/community-card 16)
|
||||
{:margin-bottom 12
|
||||
:margin-horizontal 20})}
|
||||
[rn/touchable-highlight (merge {:style {:height 56
|
||||
:border-radius 16}}
|
||||
props)
|
||||
[rn/view {:flex 1}
|
||||
[rn/view {:flex-direction :row
|
||||
:border-radius 16
|
||||
:padding-horizontal 12
|
||||
:align-items :center
|
||||
:padding-vertical 8
|
||||
:background-color background-color}
|
||||
[rn/view]
|
||||
;;TODO new pure component based on quo2 should be implemented without status-im usage
|
||||
;[communities.icon/community-icon-redesign community 32]]
|
||||
[rn/view {:flex 1
|
||||
:margin-horizontal 12}
|
||||
[text/text {:weight :semi-bold
|
||||
:size :paragraph-1
|
||||
:accessibility-label :community-name-text
|
||||
:number-of-lines 1
|
||||
:ellipsize-mode :tail
|
||||
:style {:color (when (= notifications :muted)
|
||||
(colors/theme-colors
|
||||
colors/neutral-40
|
||||
colors/neutral-60))}}
|
||||
:style {:color (when (= notifications :muted)
|
||||
(colors/theme-colors
|
||||
colors/neutral-40
|
||||
colors/neutral-60))}}
|
||||
name]
|
||||
[community-view/community-stats-column :list-view]]
|
||||
(if (= status :gated)
|
||||
[community-view/permission-tag-container {:locked? locked?
|
||||
:tokens tokens}]
|
||||
(if (= status :gated)
|
||||
[community-view/permission-tag-container {:locked? locked?
|
||||
:tokens tokens}]
|
||||
(cond
|
||||
(= notifications :unread-messages-count)
|
||||
[react/view {:style {:width 8
|
||||
:height 8
|
||||
:border-radius 4
|
||||
:background-color (colors/theme-colors
|
||||
colors/neutral-40
|
||||
colors/neutral-60)}}]
|
||||
[rn/view {:style {:width 8
|
||||
:height 8
|
||||
:border-radius 4
|
||||
:background-color (colors/theme-colors
|
||||
colors/neutral-40
|
||||
colors/neutral-60)}}]
|
||||
|
||||
(= notifications :unread-mentions-count)
|
||||
[counter/counter {:type :default} 5]
|
||||
|
||||
(= notifications :muted)
|
||||
[icons/icon :main-icons2/muted {:container-style {:align-items :center
|
||||
:justify-content :center}
|
||||
:resize-mode :center
|
||||
:size 20
|
||||
:color (colors/theme-colors
|
||||
colors/neutral-40
|
||||
colors/neutral-50)}]))]]]])
|
||||
[icons/icon :main-icons2/muted {:container-style {:align-items :center
|
||||
:justify-content :center}
|
||||
:resize-mode :center
|
||||
:size 20
|
||||
:color (colors/theme-colors
|
||||
colors/neutral-40
|
||||
colors/neutral-50)}]))]]]])
|
||||
|
||||
(defn communities-membership-list-item [{:keys [id name status tokens locked?] :as community}]
|
||||
[react/view {:margin-bottom 20}
|
||||
[react/touchable-highlight {:underlay-color colors/primary-50-opa-5
|
||||
:style {:border-radius 12}
|
||||
:on-press (fn []
|
||||
(>evt [::communities/load-category-states id])
|
||||
(>evt [:dismiss-keyboard])
|
||||
(>evt [:navigate-to :community {:community-id id}]))
|
||||
:on-long-press #(>evt [:bottom-sheet/show-sheet
|
||||
{:content (fn []
|
||||
[community/community-actions community])}])}
|
||||
[react/view {:flex 1}
|
||||
[react/view {:flex-direction :row
|
||||
:border-radius 16
|
||||
:align-items :center}
|
||||
[communities.icon/community-icon-redesign community 32]
|
||||
[react/view {:flex 1
|
||||
:margin-left 12
|
||||
:justify-content :center}
|
||||
(defn communities-membership-list-item [props {:keys [name status tokens locked?]}]
|
||||
[rn/view {:margin-bottom 20}
|
||||
[rn/touchable-highlight (merge {:underlay-color colors/primary-50-opa-5
|
||||
:style {:border-radius 12}}
|
||||
props)
|
||||
[rn/view {:flex 1}
|
||||
[rn/view {:flex-direction :row
|
||||
:border-radius 16
|
||||
:align-items :center}
|
||||
;;TODO new pure component based on quo2 should be implemented without status-im usage
|
||||
;[communities.icon/community-icon-redesign community 32]
|
||||
[rn/view {:flex 1
|
||||
:margin-left 12
|
||||
:justify-content :center}
|
||||
[text/text
|
||||
{:accessibility-label :chat-name-text
|
||||
:number-of-lines 1
|
||||
|
@ -100,7 +85,7 @@
|
|||
:size :paragraph-1}
|
||||
name]]
|
||||
(when (= status :gated)
|
||||
[react/view {:justify-content :center
|
||||
:margin-right 12}
|
||||
[community-view/permission-tag-container {:locked? locked?
|
||||
:tokens tokens}]])]]]])
|
||||
[rn/view {:justify-content :center
|
||||
:margin-right 12}
|
||||
[community-view/permission-tag-container {:locked? locked?
|
||||
:tokens tokens}]])]]]])
|
|
@ -4,42 +4,32 @@
|
|||
[quo2.components.icon :as icons]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[quo2.components.tags.permission-tag :as permission]
|
||||
[quo2.components.tags.tag :as tag]
|
||||
[status-im.ui.components.react :as react]
|
||||
[status-im.utils.money :as money]
|
||||
[status-im.i18n.i18n :as i18n]
|
||||
[status-im.ui.screens.communities.styles :as styles]))
|
||||
[quo2.components.tags.tag :as tag]
|
||||
[quo2.components.community.style :as style]
|
||||
[react-native.core :as rn]))
|
||||
|
||||
;; TODO move this component to ui namespace, status-im or re-frame ns shouldn't be used in quo
|
||||
(defn format-members [count]
|
||||
(if (> count 1000000)
|
||||
(str (money/with-precision (/ count 1000000) 1) (i18n/label :t/M))
|
||||
(if (and (> count 999) (< count 1000000))
|
||||
(str (money/with-precision (/ count 1000) 1) (i18n/label :t/K))
|
||||
count)))
|
||||
|
||||
(defn community-stats [{:keys [icon count icon-color]}]
|
||||
[react/view (styles/stats-count-container)
|
||||
[react/view {:margin-right 4}
|
||||
(defn community-stats [{:keys [icon members-count icon-color]}]
|
||||
[rn/view (style/stats-count-container)
|
||||
[rn/view {:margin-right 4}
|
||||
[icons/icon icon {:container-style {:align-items :center
|
||||
:justify-content :center}
|
||||
:resize-mode :center
|
||||
:size 16
|
||||
:color icon-color}]]
|
||||
[text/text {:weight :regular
|
||||
:size :paragraph-1}
|
||||
(format-members count)]])
|
||||
:resize-mode :center
|
||||
:size 16
|
||||
:color icon-color}]]
|
||||
[text/text {:weight :regular
|
||||
:size :paragraph-1}
|
||||
members-count]])
|
||||
|
||||
(defn community-stats-column [type]
|
||||
(let [icon-color (colors/theme-colors colors/neutral-50 colors/neutral-40)]
|
||||
[react/view (if (= type :card-view)
|
||||
(styles/card-stats-container)
|
||||
(styles/list-stats-container))
|
||||
(let [icon-color (colors/theme-colors colors/neutral-50 colors/neutral-40)]
|
||||
[rn/view (if (= type :card-view)
|
||||
(style/card-stats-container)
|
||||
(style/list-stats-container))
|
||||
[community-stats {:icon :main-icons2/group
|
||||
:count "629.2K"
|
||||
:members-count "629.2K" ;;TODO here should be formatted value, use money/format-members from outside this component
|
||||
:icon-color icon-color}]
|
||||
[community-stats {:icon :main-icons2/lightning
|
||||
:count "112.1K"
|
||||
:members-count "112.1K"
|
||||
:icon-color icon-color}]
|
||||
(when (= type :card-view)
|
||||
[community-stats {:icon :main-icons2/placeholder
|
||||
|
@ -47,36 +37,36 @@
|
|||
:icon-color icon-color}])]))
|
||||
|
||||
(defn community-tags [tags]
|
||||
[react/view (styles/community-tags-container)
|
||||
[rn/view (style/community-tags-container)
|
||||
(for [{:keys [id tag-label resource]} tags]
|
||||
^{:key id}
|
||||
[react/view {:margin-right 8}
|
||||
[rn/view {:margin-right 8}
|
||||
[tag/tag
|
||||
{:id id
|
||||
:size 24
|
||||
:label tag-label
|
||||
:type :emoji
|
||||
:labelled true
|
||||
:resource resource}]])])
|
||||
{:id id
|
||||
:size 24
|
||||
:label tag-label
|
||||
:type :emoji
|
||||
:labelled true
|
||||
:resource resource}]])])
|
||||
|
||||
(defn community-title [{:keys [title description size] :or {size :small}}]
|
||||
[react/view (styles/community-title-description-container (if (= size :large) 56 32))
|
||||
[rn/view (style/community-title-description-container (if (= size :large) 56 32))
|
||||
(when title
|
||||
[text/text
|
||||
{:accessibility-label :chat-name-text
|
||||
:number-of-lines 1
|
||||
:ellipsize-mode :tail
|
||||
:weight :semi-bold
|
||||
:size (if (= size :large) :heading-1 :heading-2)}
|
||||
:size (if (= size :large) :heading-1 :heading-2)}
|
||||
title])
|
||||
(when description
|
||||
[text/text
|
||||
{:accessibility-label :community-description-text
|
||||
:number-of-lines 2
|
||||
:ellipsize-mode :tail
|
||||
:weight :regular
|
||||
:size :paragraph-1
|
||||
:style {:margin-top (if (= size :large) 8 2)}}
|
||||
:weight :regular
|
||||
:size :paragraph-1
|
||||
:style {:margin-top (if (= size :large) 8 2)}}
|
||||
description])])
|
||||
|
||||
(defn permission-tag-container [{:keys [locked? tokens]}]
|
||||
|
|
|
@ -1,10 +1,8 @@
|
|||
(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]))
|
||||
|
||||
;; TODO move this component to ui namespace, status-im or re-frame ns shouldn't be used in quo
|
||||
[quo2.components.community.style :as style]
|
||||
[react-native.core :as rn]))
|
||||
|
||||
;; Discover card placeholders images.
|
||||
;; TODO replaced when real data is available
|
||||
|
@ -13,13 +11,13 @@
|
|||
{:id 2 :column-images [{}]}]})
|
||||
|
||||
(defn card-title-and-description [title description]
|
||||
[react/view
|
||||
[rn/view
|
||||
{:flex 1
|
||||
:padding-top 8
|
||||
:padding-bottom 8
|
||||
:border-radius 12}
|
||||
[react/view {:flex 1
|
||||
:padding-horizontal 12}
|
||||
[rn/view {:flex 1
|
||||
:padding-horizontal 12}
|
||||
[text/text {:accessibility-label :community-name-text
|
||||
:ellipsize-mode :tail
|
||||
:number-of-lines 1
|
||||
|
@ -37,53 +35,53 @@
|
|||
description]]])
|
||||
|
||||
(defn placeholder-list-images [{:keys [images width height border-radius]}]
|
||||
[react/view
|
||||
[react/view {:justify-content :center}
|
||||
[rn/view
|
||||
[rn/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}])]])
|
||||
[rn/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
|
||||
[rn/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}])
|
||||
[rn/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}])])
|
||||
[rn/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 accessibility-label]}]
|
||||
(let [on-joined-images (get images :images)]
|
||||
[react/touchable-without-feedback
|
||||
[rn/touchable-without-feedback
|
||||
{:on-press on-press
|
||||
:accessibility-label accessibility-label}
|
||||
[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})
|
||||
[rn/view (merge (style/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}
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
(ns status-im.ui.screens.communities.styles
|
||||
(:require
|
||||
[quo2.foundations.colors :as colors]))
|
||||
(ns quo2.components.community.style
|
||||
(:require [quo2.foundations.colors :as colors]))
|
||||
|
||||
(def category-item
|
||||
{:flex 1
|
|
@ -0,0 +1,87 @@
|
|||
(ns quo2.core
|
||||
(:require quo2.components.buttons.button
|
||||
quo2.components.buttons.dynamic-button
|
||||
quo2.components.markdown.text
|
||||
quo2.components.icon
|
||||
quo2.components.separator
|
||||
quo2.components.header
|
||||
quo2.components.avatars.account-avatar
|
||||
quo2.components.avatars.channel-avatar
|
||||
quo2.components.avatars.group-avatar
|
||||
quo2.components.avatars.icon-avatar
|
||||
quo2.components.avatars.user-avatar
|
||||
quo2.components.avatars.wallet-user-avatar
|
||||
quo2.components.community.community-card-view
|
||||
quo2.components.community.community-list-view
|
||||
quo2.components.community.community-view
|
||||
quo2.components.community.discover-card
|
||||
quo2.components.counter.counter
|
||||
quo2.components.dividers.divider-label
|
||||
quo2.components.dividers.new-messages
|
||||
quo2.components.drawers.action-drawers
|
||||
quo2.components.dropdowns.dropdown
|
||||
quo2.components.info.info-message
|
||||
quo2.components.info.information-box
|
||||
quo2.components.list-items.channel
|
||||
quo2.components.list-items.menu-item
|
||||
quo2.components.list-items.preview-list
|
||||
quo2.components.messages.gap
|
||||
quo2.components.messages.system-message
|
||||
quo2.components.reactions.reaction
|
||||
quo2.components.notifications.activity-logs
|
||||
quo2.components.notifications.info-count
|
||||
quo2.components.notifications.notification-dot
|
||||
quo2.components.tags.tags
|
||||
quo2.components.tabs.tabs
|
||||
quo2.components.tabs.account-selector))
|
||||
|
||||
(def button quo2.components.buttons.button/button)
|
||||
(def dynamic-button quo2.components.buttons.dynamic-button/dynamic-button)
|
||||
(def text quo2.components.markdown.text/text)
|
||||
(def icon quo2.components.icon/icon)
|
||||
(def separator quo2.components.separator/separator)
|
||||
(def counter quo2.components.counter.counter/counter)
|
||||
(def header quo2.components.header/header)
|
||||
(def action-drawer quo2.components.drawers.action-drawers/action-drawer)
|
||||
(def dropdown quo2.components.dropdowns.dropdown/dropdown)
|
||||
(def info-message quo2.components.info.info-message/info-message)
|
||||
(def information-box quo2.components.info.information-box/information-box)
|
||||
(def gap quo2.components.messages.gap/gap)
|
||||
(def system-message quo2.components.messages.system-message/system-message)
|
||||
(def reaction quo2.components.reactions.reaction/reaction)
|
||||
(def tags quo2.components.tags.tags/tags)
|
||||
(def tabs quo2.components.tabs.tabs/tabs)
|
||||
(def scrollable-tabs quo2.components.tabs.tabs/scrollable-tabs)
|
||||
(def account-selector quo2.components.tabs.account-selector/account-selector)
|
||||
|
||||
;;;; AVATAR
|
||||
(def account-avatar quo2.components.avatars.account-avatar/account-avatar)
|
||||
(def channel-avatar quo2.components.avatars.channel-avatar/channel-avatar)
|
||||
(def group-avatar quo2.components.avatars.group-avatar/group-avatar)
|
||||
(def icon-avatar quo2.components.avatars.icon-avatar/icon-avatar)
|
||||
(def user-avatar quo2.components.avatars.user-avatar/user-avatar)
|
||||
(def wallet-user-avatar quo2.components.avatars.wallet-user-avatar/wallet-user-avatar)
|
||||
|
||||
;;;; COMMUNITY
|
||||
(def community-card-view-item quo2.components.community.community-card-view/community-card-view-item)
|
||||
(def communities-list-view-item quo2.components.community.community-list-view/communities-list-view-item)
|
||||
(def communities-membership-list-item quo2.components.community.community-list-view/communities-membership-list-item)
|
||||
(def community-stats-column quo2.components.community.community-view/community-stats-column)
|
||||
(def community-stats quo2.components.community.community-view/community-stats)
|
||||
(def community-tags quo2.components.community.community-view/community-tags)
|
||||
(def community-title quo2.components.community.community-view/community-title)
|
||||
(def discover-card quo2.components.community.discover-card/discover-card)
|
||||
|
||||
;;;; DIVIDERS
|
||||
(def divider-label quo2.components.dividers.divider-label/divider-label)
|
||||
(def new-messages quo2.components.dividers.new-messages/new-messages)
|
||||
|
||||
;;;; LIST ITEMS
|
||||
(def channel-list-item quo2.components.list-items.channel/list-item)
|
||||
(def menu-item quo2.components.list-items.menu-item/menu-item)
|
||||
(def preview-list quo2.components.list-items.preview-list/preview-list)
|
||||
|
||||
;;;; NOTIFICATIONS
|
||||
(def activity-log quo2.components.notifications.activity-logs/activity-log)
|
||||
(def info-count quo2.components.notifications.info-count/info-count)
|
||||
(def notification-dot quo2.components.notifications.notification-dot/notification-dot)
|
|
@ -655,7 +655,7 @@
|
|||
{:db (update-in db [:communities community-id :categories] merge categories)}))
|
||||
|
||||
(fx/defn load-category-states
|
||||
{:events [::load-category-states]}
|
||||
{:events [:communities/load-category-states]}
|
||||
[{:keys [db]} community-id]
|
||||
(let [public-key (get-in db [:multiaccount :public-key])
|
||||
categories (get-in db [:communities community-id :categories])
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
(ns quo2.components.switcher.styles
|
||||
(ns status-im.switcher.switcher-cards.styles
|
||||
(:require [quo2.foundations.colors :as colors]))
|
||||
|
||||
(def colors-map
|
|
@ -1,22 +1,18 @@
|
|||
(ns quo2.components.switcher.switcher-cards
|
||||
(ns status-im.switcher.switcher-cards.switcher-cards
|
||||
(:require [react-native.core :as rn]
|
||||
[react-native.fast-image :as fast-image]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[quo2.components.markdown.text :as text]
|
||||
[quo2.components.buttons.button :as button]
|
||||
[quo2.components.switcher.styles :as styles]
|
||||
[quo2.components.counter.counter :as counter]
|
||||
[quo2.components.tags.status-tags :as status-tags]
|
||||
[quo2.components.avatars.user-avatar :as user-avatar]
|
||||
[quo2.components.avatars.group-avatar :as group-avatar]
|
||||
[quo2.components.list-items.preview-list :as preview-list]
|
||||
[quo2.components.avatars.channel-avatar :as channel-avatar]
|
||||
[status-im.switcher.switcher-cards.styles :as styles]
|
||||
[status-im.i18n.i18n :as i18n]))
|
||||
|
||||
;;TODO move outside quo or find a way how to move i18n outside
|
||||
|
||||
;; Supporting Components
|
||||
|
||||
(defn content-container [{:keys [content-type data new-notifications? color-50]}]
|
||||
[rn/view {:style (styles/content-container new-notifications?)}
|
||||
(case content-type
|
|
@ -22,7 +22,7 @@
|
|||
[re-frame.core :as re-frame]
|
||||
[status-im.ui.screens.chat.sheets :as sheets]
|
||||
[status-im.ui.components.accordion :as accordion]
|
||||
[status-im.ui.screens.communities.styles :as styles]))
|
||||
[quo2.components.community.style :as styles]))
|
||||
|
||||
(def request-cooldown-ms (* 24 60 60 1000))
|
||||
|
||||
|
|
|
@ -8,13 +8,13 @@
|
|||
[quo2.components.dividers.divider-label :as divider-label]
|
||||
[quo2.components.community.community-view :as community-view]
|
||||
[quo2.components.tags.status-tags :as status-tags]
|
||||
[quo2.components.community.style :as styles]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[quo2.components.navigation.page-nav :as page-nav]
|
||||
[status-im.ui.screens.communities.request-to-join-bottom-sheet-redesign :as request-to-join]
|
||||
[status-im.ui.screens.communities.community-options-bottom-sheet :as options-menu]
|
||||
[status-im.ui.components.list.views :as list]
|
||||
[status-im.utils.handlers :refer [<sub >evt]]
|
||||
[status-im.ui.screens.communities.styles :as styles]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[quo2.components.navigation.page-nav :as page-nav]
|
||||
[status-im.ui.screens.communities.icon :as communities.icon]))
|
||||
|
||||
;; Mocked list items
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
[status-im.communities.core :as communities]
|
||||
[status-im.utils.handlers :refer [>evt <sub]]
|
||||
[status-im.ui.components.icons.icons :as icons]
|
||||
[status-im.ui.screens.communities.styles :as styles]
|
||||
[quo2.components.community.style :as styles]
|
||||
[status-im.ui.components.topbar :as topbar]
|
||||
[status-im.ui.components.react :as react]
|
||||
[status-im.ui.components.tabs :as tabs]
|
||||
|
|
|
@ -41,7 +41,7 @@
|
|||
{:border-bottom-color (quo.colors/get-color :ui-01)
|
||||
:border-bottom-width 1}))
|
||||
:on-press (fn []
|
||||
(>evt [::communities/load-category-states id])
|
||||
(>evt [:communities/load-category-states id])
|
||||
(>evt [:dismiss-keyboard])
|
||||
(>evt [:navigate-to :community {:community-id id}]))
|
||||
:on-long-press #(>evt [:bottom-sheet/show-sheet
|
||||
|
|
|
@ -12,7 +12,8 @@
|
|||
[status-im.i18n.i18n :as i18n]
|
||||
[status-im.ui.components.list.views :as list]
|
||||
[status-im.ui.components.react :as rn]
|
||||
[status-im.ui.components.plus-button :as components.plus-button]))
|
||||
[status-im.ui.components.plus-button :as components.plus-button]
|
||||
[status-im.ui.screens.communities.community :as community]))
|
||||
|
||||
(def selected-tab (reagent/atom :joined))
|
||||
|
||||
|
@ -25,7 +26,15 @@
|
|||
:accessibility-label :new-chat-button}]))
|
||||
|
||||
(defn render-fn [community-item]
|
||||
[community-list-view/communities-membership-list-item community-item])
|
||||
[community-list-view/communities-membership-list-item
|
||||
{:on-press (fn []
|
||||
(>evt [:communities/load-category-states (:id community-item)])
|
||||
(>evt [:dismiss-keyboard])
|
||||
(>evt [:navigate-to :community {:community-id (:id community-item)}]))
|
||||
:on-long-press #(>evt [:bottom-sheet/show-sheet
|
||||
{:content (fn []
|
||||
[community/community-actions community-item])}])}
|
||||
community-item])
|
||||
|
||||
(defn community-list-key-fn [item]
|
||||
(:id item))
|
||||
|
|
|
@ -7,12 +7,13 @@
|
|||
[quo2.components.counter.counter :as quo2.counter]
|
||||
[quo.components.safe-area :as safe-area]
|
||||
[status-im.react-native.resources :as resources]
|
||||
[status-im.utils.handlers :refer [<sub >evt]]
|
||||
[status-im.utils.handlers :refer [<sub >evt]]
|
||||
[quo2.components.buttons.button :as quo2.button]
|
||||
[quo2.components.community.community-card-view :as community-card]
|
||||
[quo2.components.community.community-list-view :as community-list]
|
||||
[quo2.components.icon :as icons]
|
||||
[quo2.foundations.colors :as colors]))
|
||||
[quo2.foundations.colors :as colors]
|
||||
[status-im.ui.screens.communities.community :as community]))
|
||||
|
||||
(def view-type (reagent/atom :card-view))
|
||||
|
||||
|
@ -40,7 +41,15 @@
|
|||
{:featured false})]
|
||||
(if (= @view-type :card-view)
|
||||
[community-card/community-card-view-item item #(>evt [:navigate-to :community-overview item])]
|
||||
[community-list/communities-list-view-item item])))
|
||||
[community-list/communities-list-view-item
|
||||
{:on-press (fn []
|
||||
(>evt [:communities/load-category-states (:id item)])
|
||||
(>evt [:dismiss-keyboard])
|
||||
(>evt [:navigate-to :community {:community-id (:id item)}]))
|
||||
:on-long-press #(>evt [:bottom-sheet/show-sheet
|
||||
{:content (fn []
|
||||
[community/community-actions item])}])}
|
||||
item])))
|
||||
|
||||
(defn render-featured-fn [community-item]
|
||||
(let [item (merge community-item
|
||||
|
|
|
@ -56,8 +56,8 @@
|
|||
[preview/customizer state descriptor]]
|
||||
[rn/view {:padding-vertical 60
|
||||
:justify-content :center}
|
||||
[community-list-view/communities-list-view-item (merge @state
|
||||
community-data)]]]])))
|
||||
[community-list-view/communities-list-view-item {} (merge @state
|
||||
community-data)]]]])))
|
||||
|
||||
(defn preview-community-list-view []
|
||||
[rn/view {:background-color (colors/theme-colors colors/neutral-5
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
[status-im.ui2.screens.quo2-preview.preview :as preview]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[status-im.react-native.resources :as resources]
|
||||
[quo2.components.switcher.switcher-cards :as switcher-cards]))
|
||||
[status-im.switcher.switcher-cards.switcher-cards :as switcher-cards]))
|
||||
|
||||
(def descriptor [{:label "Type"
|
||||
:key :type
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
(ns status-im.utils.money
|
||||
(:require ["bignumber.js" :as BigNumber]
|
||||
[clojure.string :as string]))
|
||||
[clojure.string :as string]
|
||||
[status-im.i18n.i18n :as i18n]))
|
||||
|
||||
;; The BigNumber version included in web3 sometimes hangs when dividing large
|
||||
;; numbers Hence we want to use these functions instead of fromWei etc, which
|
||||
|
@ -191,3 +192,10 @@
|
|||
|
||||
(defn div-and-round [bn1 bn2]
|
||||
(.round (.dividedBy ^js bn1 bn2) 0))
|
||||
|
||||
(defn format-members [count]
|
||||
(if (> count 1000000)
|
||||
(str (with-precision (/ count 1000000) 1) (i18n/label :t/M))
|
||||
(if (and (> count 999) (< count 1000000))
|
||||
(str (with-precision (/ count 1000) 1) (i18n/label :t/K))
|
||||
count)))
|
||||
|
|
Loading…
Reference in New Issue