Merge pull request #2324 from penpot/eva-fix-library-colors

🐛 Fix library color selector
This commit is contained in:
Alejandro 2022-09-22 16:48:48 +02:00 committed by GitHub
commit b2d0f3cac2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 24 additions and 26 deletions

View file

@ -14,7 +14,7 @@
[app.common.spec :as us] [app.common.spec :as us]
[clojure.spec.alpha :as s])) [clojure.spec.alpha :as s]))
(def precision 3) (def precision 6)
;; --- Matrix Impl ;; --- Matrix Impl

View file

@ -300,13 +300,13 @@
[key default] [key default]
(let [id (use-id) (let [id (use-id)
state (mf/use-state (get @storage key default)) state (mf/use-state (get @storage key default))
stream (mf/with-memo [] stream (mf/with-memo [id]
(->> mbc/stream (->> mbc/stream
(rx/filter #(= (:type %) key))
(rx/filter #(not= (:id %) id)) (rx/filter #(not= (:id %) id))
(rx/filter #(= (:type %) key))
(rx/map deref)))] (rx/map deref)))]
(mf/with-effect [@state key] (mf/with-effect [@state key id]
(mbc/emit! id key @state) (mbc/emit! id key @state)
(swap! storage assoc key @state)) (swap! storage assoc key @state))

View file

@ -37,17 +37,17 @@
(mf/defc palette (mf/defc palette
[{:keys [current-colors recent-colors file-colors shared-libs selected on-select]}] [{:keys [current-colors recent-colors file-colors shared-libs selected on-select]}]
(let [;; We had to do this due to a bug that leave some bugged colors (let [;; We had to do this due to a bug that leave some bugged colors
current-colors (filter #(or (:gradient %) (:color %)) current-colors) current-colors (h/use-equal-memo (filter #(or (:gradient %) (:color %)) current-colors))
state (mf/use-state {:show-menu false}) state (mf/use-state {:show-menu false})
width (:width @state 0) width (:width @state 0)
visible (/ width 66) visible (/ width 66)
offset (:offset @state 0) offset (:offset @state 0)
max-offset (- (count current-colors) max-offset (- (count current-colors)
visible) visible)
container (mf/use-ref nil) container (mf/use-ref nil)
{:keys [on-pointer-down on-lost-pointer-capture on-mouse-move parent-ref size]} {:keys [on-pointer-down on-lost-pointer-capture on-mouse-move parent-ref size]}
(use-resize-hook :palette 72 54 80 :y true :bottom) (use-resize-hook :palette 72 54 80 :y true :bottom)
@ -139,7 +139,7 @@
(tr "workspace.libraries.colors.file-library") (tr "workspace.libraries.colors.file-library")
(str/ffmt " (%)" (count file-colors)))] (str/ffmt " (%)" (count file-colors)))]
[:div.color-sample [:div.color-sample
(for [[i color] (map-indexed vector (take 7 (vals file-colors))) ] (for [[i color] (map-indexed vector (take 7 (vals file-colors)))]
[:& cb/color-bullet {:key (dm/str "color-" i) [:& cb/color-bullet {:key (dm/str "color-" i)
:color color}])]] :color color}])]]
@ -150,7 +150,7 @@
[:div.library-name (str (tr "workspace.libraries.colors.recent-colors") [:div.library-name (str (tr "workspace.libraries.colors.recent-colors")
(str/format " (%s)" (count recent-colors)))] (str/format " (%s)" (count recent-colors)))]
[:div.color-sample [:div.color-sample
(for [[idx color] (map-indexed vector (take 7 (reverse recent-colors))) ] (for [[idx color] (map-indexed vector (take 7 (reverse recent-colors)))]
[:& cb/color-bullet {:key (str "color-" idx) [:& cb/color-bullet {:key (str "color-" idx)
:color color}])]]]] :color color}])]]]]
@ -185,13 +185,11 @@
on-select (mf/use-fn #(reset! selected %))] on-select (mf/use-fn #(reset! selected %))]
(mf/with-effect [@selected] (mf/with-effect [@selected]
(fn [] (let [colors' (cond
(reset! colors (= @selected :recent) (reverse recent-colors)
(into [] (= @selected :file) (->> (vals file-colors) (sort-by :name))
(cond :else (->> (library->colors shared-libs @selected) (sort-by :name)))]
(= @selected :recent) (reverse recent-colors) (reset! colors (into [] colors'))))
(= @selected :file) (->> (vals file-colors) (sort-by :name))
:else (->> (library->colors shared-libs @selected) (sort-by :name)))))))
(mf/with-effect [recent-colors @selected] (mf/with-effect [recent-colors @selected]
(when (= @selected :recent) (when (= @selected :recent)

View file

@ -7,7 +7,7 @@
(ns app.main.ui.workspace.colorpicker.libraries (ns app.main.ui.workspace.colorpicker.libraries
(:require (:require
[app.common.data.macros :as dm] [app.common.data.macros :as dm]
[app.main.data.workspace.colors :as dc] [app.main.data.workspace.colors :as mdc]
[app.main.refs :as refs] [app.main.refs :as refs]
[app.main.store :as st] [app.main.store :as st]
[app.main.ui.components.color-bullet :refer [color-bullet]] [app.main.ui.components.color-bullet :refer [color-bullet]]
@ -19,13 +19,13 @@
(mf/defc libraries (mf/defc libraries
[{:keys [on-select-color on-add-library-color disable-gradient disable-opacity]}] [{:keys [on-select-color on-add-library-color disable-gradient disable-opacity]}]
(let [selected (h/use-shared-state dc/colorpicker-selected-broadcast-key :recent) (let [selected (h/use-shared-state mdc/colorpicker-selected-broadcast-key :recent)
current-colors (mf/use-state []) current-colors (mf/use-state [])
shared-libs (mf/deref refs/workspace-libraries) shared-libs (mf/deref refs/workspace-libraries)
file-colors (mf/deref refs/workspace-file-colors) file-colors (mf/deref refs/workspace-file-colors)
recent-colors (mf/deref refs/workspace-recent-colors) recent-colors (mf/deref refs/workspace-recent-colors)
recent-colors (filter #(or (:gradient %) (:color %)) recent-colors) recent-colors (h/use-equal-memo (filter #(or (:gradient %) (:color %)) recent-colors))
on-library-change on-library-change
(mf/use-fn (mf/use-fn
@ -81,7 +81,7 @@
i/plus]) i/plus])
[:div.color-bullet.button {:style {:background-color "var(--color-white)"} [:div.color-bullet.button {:style {:background-color "var(--color-white)"}
:on-click #(st/emit! (dc/show-palette @selected))} :on-click #(st/emit! (mdc/show-palette @selected))}
i/palette] i/palette]
(for [[idx color] (map-indexed vector @current-colors)] (for [[idx color] (map-indexed vector @current-colors)]