Settings/Data Item - editable variant (#20656)

This commit is contained in:
Ajay Sivan 2024-07-12 16:45:37 +05:30 committed by GitHub
parent 1c85b292f8
commit 20b256b0d0
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 61 additions and 7 deletions

View File

@ -159,4 +159,19 @@
:icon :i/placeholder
:emoji "🎮"
:customization-color :yellow}])
(h/is-truthy (h/query-by-label-text :account-emoji))))
(h/is-truthy (h/query-by-label-text :account-emoji)))
(h/test "edit icon is visible when subtitle type is editable"
(h/render [quo/data-item
{:on-press (h/mock-fn)
:blur? false
:card? true
:status :default
:size :default
:title "Label"
:subtitle "Subtitle"
:subtitle-type :editable
:icon :i/placeholder
:emoji "🎮"
:customization-color :yellow}])
(h/is-truthy (h/query-by-label-text :edit-icon))))

View File

@ -54,6 +54,7 @@
(def subtitle-container
{:flex-direction :row
:align-items :center
:margin-bottom 1})
(def right-container
@ -62,7 +63,7 @@
(defn subtitle-icon-container
[subtitle-type]
{:margin-right (when (not= :default subtitle-type) 4)
{:margin-right (when-not (contains? #{:editable :default} subtitle-type) 4)
:justify-content :center})
(defn title

View File

@ -7,7 +7,8 @@
[quo.components.settings.data-item.style :as style]
[quo.foundations.colors :as colors]
[quo.theme :as quo.theme]
[react-native.core :as rn]))
[react-native.core :as rn]
[schema.core :as schema]))
(defn- left-loading
[{:keys [size blur?]}]
@ -40,7 +41,17 @@
{:weight :medium
:size :paragraph-2
:style (style/description blur? theme)}
subtitle]]))
subtitle]
(when (= subtitle-type :editable)
[icons/icon :i/edit
{:accessibility-label :edit-icon
:size 12
:container-style {:margin-left 2}
:color (if blur?
colors/neutral-40
(colors/theme-colors colors/neutral-50
colors/neutral-40
theme))}])]))
(defn- left-title
[{:keys [title blur?]}]
@ -100,7 +111,31 @@
:color icon-color
:size 20}]])]))
(defn view
(def ?schema
[:=>
[:catn
[:props
[:map {:closed true}
[:blur? {:optional true} [:maybe :boolean]]
[:card? {:optional true} [:maybe :boolean]]
[:right-icon {:optional true} [:maybe :keyword]]
[:right-content {:optional true} [:maybe :map]]
[:status {:optional true} [:maybe [:enum :default :loading]]]
[:subtitle-type {:optional true} [:maybe [:enum :default :icon :network :account :editable]]]
[:size {:optional true} [:maybe [:enum :default :small :large]]]
[:title :string]
[:subtitle {:optional true} [:maybe :string]]
[:custom-subtitle {:optional true} [:maybe fn?]]
[:icon {:optional true} [:maybe :keyword]]
[:emoji {:optional true} [:maybe :string]]
[:customization-color {:optional true} [:maybe :schema.common/customization-color]]
[:network-image {:optional true} [:maybe :schema.common/image-source]]
[:on-press {:optional true} [:maybe fn?]]
[:container-style {:optional true} [:maybe :map]]]]]
:any])
(defn view-internal
[{:keys [blur? card? right-icon right-content status size on-press container-style]
:as props}]
(let [theme (quo.theme/use-theme)
@ -123,3 +158,5 @@
{:right-icon right-icon
:right-content right-content
:icon-color icon-color}])]))
(def view (schema/instrument #'view-internal ?schema))

View File

@ -47,7 +47,8 @@
:options [{:key :default}
{:key :icon}
{:key :network}
{:key :account}]}
{:key :account}
{:key :editable}]}
{:type :select
:key :status
:options [{:key :default}

View File

@ -83,7 +83,7 @@
{:style style/about-tab
:content-container-style {:padding-bottom (+ constants/floating-shell-button-height 8)}}
[quo/data-item
{:description :default
{:subtitle-type :default
:right-icon :i/options
:card? true
:status :default