diff --git a/src/quo/components/settings/category/settings/view.cljs b/src/quo/components/settings/category/settings/view.cljs index f5a8198b3c..566b1147ee 100644 --- a/src/quo/components/settings/category/settings/view.cljs +++ b/src/quo/components/settings/category/settings/view.cljs @@ -7,20 +7,23 @@ [react-native.core :as rn])) (defn settings-category - [{:keys [label data container-style] :as props}] - (let [theme (quo.theme/use-theme) - settings-item (filter identity data)] + [{:keys [label data blur? container-style]}] + (let [theme (quo.theme/use-theme) + settings-items (remove nil? data) + last-index (dec (count settings-items))] [rn/view {:style (merge (style/container label) container-style)} (when label [text/text {:weight :medium :size :paragraph-2 - :style (style/label props theme)} + :style (style/label blur? theme)} label]) - [rn/view {:style (style/settings-items props theme)} - (for [item settings-item] - ^{:key item} - [:<> - [settings-item/view item] - (when-not (= item (last settings-item)) - [rn/view {:style (style/settings-separator props theme)}])])]])) + [rn/view {:style (style/settings-items blur? theme)} + (map-indexed + (fn [index item] + ^{:key (str label (:title item))} + [:<> + [settings-item/view item] + (when-not (= last-index index) + [rn/view {:style (style/settings-separator blur? theme)}])]) + settings-items)]])) diff --git a/src/quo/components/settings/category/style.cljs b/src/quo/components/settings/category/style.cljs index ade6924d91..ee59a5f51b 100644 --- a/src/quo/components/settings/category/style.cljs +++ b/src/quo/components/settings/category/style.cljs @@ -11,7 +11,7 @@ :padding-bottom 8}) (defn settings-items - [{:keys [blur?]} theme] + [blur? theme] {:border-radius 16 :background-color (if blur? colors/white-opa-5 @@ -22,7 +22,7 @@ (colors/theme-colors colors/neutral-10 colors/neutral-80 theme))}) (defn label - [{:keys [blur?]} theme] + [blur? theme] {:margin-bottom 12 :color (if blur? colors/white-opa-40 @@ -32,7 +32,7 @@ {:margin-top 12}) (defn settings-separator - [{:keys [blur?]} theme] + [blur? theme] {:height 1 :background-color (if blur? colors/white-opa-5 diff --git a/src/quo/components/settings/settings_item/view.cljs b/src/quo/components/settings/settings_item/view.cljs index 964342d48b..4f800748ba 100644 --- a/src/quo/components/settings/settings_item/view.cljs +++ b/src/quo/components/settings/settings_item/view.cljs @@ -116,7 +116,8 @@ [rn/view {:style (style/left-container (:image props))} [text/text {:weight :medium - :style {:color (when blur? colors/white)}} title] + :style {:color (when blur? colors/white)}} + title] [description-component props] [tag-component props]]] [rn/view {:style (style/sub-container (:alignment action-props))} diff --git a/src/status_im/contexts/profile/edit/list_items.cljs b/src/status_im/contexts/profile/edit/list_items.cljs index 8bc15bb0a2..ace8f43ce7 100644 --- a/src/status_im/contexts/profile/edit/list_items.cljs +++ b/src/status_im/contexts/profile/edit/list_items.cljs @@ -3,6 +3,7 @@ [quo.foundations.colors :as colors] [status-im.common.not-implemented :as not-implemented] [status-im.config :as config] + [status-im.constants :as constants] [status-im.contexts.profile.edit.style :as style] [status-im.contexts.profile.utils :as profile.utils] [utils.i18n :as i18n] @@ -19,7 +20,7 @@ :on-press #(rf/dispatch [:open-modal :edit-name]) :blur? true :label :text - :label-props full-name + :label-props (utils/truncate-str full-name constants/profile-name-max-length) :action :arrow :container-style style/item-container} {:title (i18n/label :t/bio)