chore: update group-avatar component

This commit is contained in:
codemaster115 2023-08-08 15:49:35 -05:00
parent da22f4a809
commit 7bc98fcc44
No known key found for this signature in database
GPG Key ID: 745FA1711381B2B0
2 changed files with 23 additions and 46 deletions

View File

@ -1,31 +0,0 @@
(ns quo2.components.avatars.group-avatar.view
(:require [quo2.components.icon :as icon]
[quo2.theme :as quo.theme]
[quo2.foundations.colors :as colors]
[react-native.core :as rn]
[quo2.components.avatars.group-avatar.style :as style]))
(def sizes
{:icon {:small 12
:medium 16
:large 20}
:container {:small 20
:medium 32
:large 48}})
;; TODO: this implementation does not support group display picture (can only display default group
;; icon).
(defn- view-internal
[_]
(fn [{:keys [color size theme]}]
(let [container-size (get-in sizes [:container size])
icon-size (get-in sizes [:icon size])]
[rn/view
{:style (style/container {:container-size container-size
:customization-color color
:theme theme})}
[icon/icon :i/group
{:size icon-size
:color colors/white-opa-70}]])))
(def view (quo.theme/with-theme view-internal))

View File

@ -3,33 +3,36 @@
[quo2.foundations.colors :as colors]
[react-native.core :as rn]
[reagent.core :as reagent]
[status-im2.common.resources :as resources]
[status-im2.contexts.quo-preview.preview :as preview]))
(def descriptor
[{:label "Size"
:key :size
:type :select
:options [{:key :small
:options [{:key :x-small
:value "x-small"}
{:key :small
:value "Small"}
{:key :medium
:value "Medium"}
{:key :large
:value "Large"}]}
{:label "Color"
:key :color
:type :select
:options
(map
(fn [c]
{:key c
:value c})
["#ff0000" "#0000ff"])}]) ; TODO: this is temporary only. Issue: https://github.com/status-im/status-mobile/issues/14566
:value "Large"}
{:key :x-large
:value "x-Large"}]}
{:label "Avatar"
:key :avatar?
:type :boolean}
(preview/customization-color-option)]) ; TODO: this is temporary only. Issue: https://github.com/status-im/status-mobile/issues/14566
(def avatar (resources/get-mock-image :user-picture-male4))
(defn cool-preview
[]
(let [state (reagent/atom {:theme :light
:color :purple
:size :small})]
:customization-color :blue
:size :small
:avatar? false})]
(fn []
[rn/touchable-without-feedback {:on-press rn/dismiss-keyboard!}
[rn/view {:padding-bottom 150}
@ -39,7 +42,12 @@
{:padding-vertical 60
:flex-direction :row
:justify-content :center}
[quo2/group-avatar @state]]]])))
(let [{:keys [avatar?]} @state
params (cond-> @state
(boolean avatar?)
(assoc :avatar? avatar))]
(println params)
[quo2/group-avatar params])]]])))
(defn preview-group-avatar
[]