fix: group-avatar component usage (#17041)

This commit is contained in:
codemaster 2023-08-22 09:46:10 -04:00 committed by GitHub
parent 8e7c6fe778
commit 27f11fcb2d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 42 additions and 43 deletions

View File

@ -8,7 +8,7 @@
:align-items :center :align-items :center
:justify-content :center :justify-content :center
:border-radius (/ container-size 2) :border-radius (/ container-size 2)
:background-color :overflow :hidden
(colors/theme-colors (colors/custom-color customization-color 50) :background-color (colors/theme-colors (colors/custom-color customization-color 50)
(colors/custom-color customization-color 60) (colors/custom-color customization-color 60)
theme)}) theme)})

View File

@ -7,25 +7,24 @@
[quo2.components.avatars.group-avatar.style :as style])) [quo2.components.avatars.group-avatar.style :as style]))
(def sizes (def sizes
{:icon {:x-small 12 {:size/s-20 {:icon 12
:small 16 :container 20}
:medium 16 :size/s-28 {:icon 16
:large 20 :container 28}
:x-large 32} :size/s-32 {:icon 16
:container {:x-small 20 :container 32}
:small 28 :size/s-48 {:icon 20
:medium 32 :container 48}
:large 48 :size/s-80 {:icon 32
:x-large 80}}) :container 80}})
(defn- view-internal (defn- view-internal
[_] [_]
(fn [{:keys [size theme customization-color picture] (fn [{:keys [size theme customization-color picture]
:or {size :x-small :or {size :size/s-20
customization-color :blue customization-color :blue}}]
picture nil}}] (let [container-size (get-in sizes [size :container])
(let [container-size (get-in sizes [:container size]) icon-size (get-in sizes [size :icon])]
icon-size (get-in sizes [:icon size])]
[rn/view [rn/view
{:style (style/container {:container-size container-size {:style (style/container {:container-size container-size
:customization-color customization-color :customization-color customization-color

View File

@ -11,7 +11,7 @@
(if group-chat (if group-chat
[quo/group-avatar [quo/group-avatar
{:customization-color color {:customization-color color
:size :x-small}] :size :size/s-20}]
[quo/user-avatar [quo/user-avatar
{:full-name display-name {:full-name display-name
:profile-picture photo-path :profile-picture photo-path

View File

@ -169,7 +169,7 @@
:padding-horizontal 20}} :padding-horizontal 20}}
[quo/group-avatar [quo/group-avatar
{:customization-color color {:customization-color color
:size :small}] :size :size/s-32}]
[quo/text [quo/text
{:weight :semi-bold {:weight :semi-bold
:size :heading-1 :size :heading-1

View File

@ -211,7 +211,7 @@
(assoc :ring? false))]) (assoc :ring? false))])
[quo/group-avatar [quo/group-avatar
{:customization-color color {:customization-color color
:size :small}])) :size :size/s-32}]))
(defn notification (defn notification
[{:keys [muted group-chat unviewed-messages-count unviewed-mentions-count]}] [{:keys [muted group-chat unviewed-messages-count unviewed-mentions-count]}]

View File

@ -10,28 +10,28 @@
[{:label "Size" [{:label "Size"
:key :size :key :size
:type :select :type :select
:options [{:key :x-small :options [{:key :size/s-20
:value "x-small"} :value "20"}
{:key :small {:key :size/s-28
:value "Small"} :value "28"}
{:key :medium {:key :size/s-32
:value "Medium"} :value "32"}
{:key :large {:key :size/s-48
:value "Large"} :value "48"}
{:key :x-large {:key :size/s-80
:value "x-Large"}]} :value "80"}]}
{:label "Avatar" {:label "Avatar"
:key :picture? :key :picture?
:type :boolean} :type :boolean}
(preview/customization-color-option)]) (preview/customization-color-option)])
(def avatar (resources/get-mock-image :user-picture-male4)) (def avatar (resources/get-mock-image :photo1))
(defn cool-preview (defn cool-preview
[] []
(let [state (reagent/atom {:theme :light (let [state (reagent/atom {:theme :light
:customization-color :blue :customization-color :blue
:size :small :size :size/s-20
:picture? false})] :picture? false})]
(fn [] (fn []
[rn/touchable-without-feedback {:on-press rn/dismiss-keyboard!} [rn/touchable-without-feedback {:on-press rn/dismiss-keyboard!}

View File

@ -141,7 +141,7 @@
:group-avatar [quo2/group-avatar-tag (:label @state) :group-avatar [quo2/group-avatar-tag (:label @state)
{:blur? (:blur? @state) {:blur? (:blur? @state)
:size :x-small :size :size/s-20
:customization-color :purple}] :customization-color :purple}]
:public-key [quo2/public-key-tag :public-key [quo2/public-key-tag

View File

@ -9,7 +9,7 @@
[utils.re-frame :as rf])) [utils.re-frame :as rf]))
(def tag-params (def tag-params
{:size :small {:size :size/s-20
:customization-color :blue :customization-color :blue
:style style/user-avatar-tag :style style/user-avatar-tag
:text-style style/user-avatar-tag-text :text-style style/user-avatar-tag-text

View File

@ -67,7 +67,7 @@
:context [[common/user-avatar-tag author] :context [[common/user-avatar-tag author]
(i18n/label :t/added-you-to) (i18n/label :t/added-you-to)
[quo/group-avatar-tag chat-name [quo/group-avatar-tag chat-name
{:size :x-small {:size :size/s-20
:customization-color :purple}]] :customization-color :purple}]]
:items (when-not (or accepted dismissed) :items (when-not (or accepted dismissed)
[{:type :button [{:type :button

View File

@ -125,7 +125,7 @@
shell.constants/private-group-chat-card shell.constants/private-group-chat-card
[quo/group-avatar [quo/group-avatar
{:customization-color customization-color {:customization-color customization-color
:size :large :size :size/s-48
:override-theme :dark}] :override-theme :dark}]
(shell.constants/community-card (shell.constants/community-card