From 4a06cc04d82d1f826b59d8bf2f39168e219f3f7d Mon Sep 17 00:00:00 2001
From: Florian Schroedl <flo.schroedl@gmail.com>
Date: Tue, 3 Dec 2024 17:42:40 +0100
Subject: [PATCH 1/2] =?UTF-8?q?=E2=9C=A8=20Add=20test=20for=20applying=20c?=
 =?UTF-8?q?olors?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../tokens/logic/token_actions_test.cljs      | 32 +++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/frontend/test/frontend_tests/tokens/logic/token_actions_test.cljs b/frontend/test/frontend_tests/tokens/logic/token_actions_test.cljs
index 0df429b6e..2f861a503 100644
--- a/frontend/test/frontend_tests/tokens/logic/token_actions_test.cljs
+++ b/frontend/test/frontend_tests/tokens/logic/token_actions_test.cljs
@@ -129,6 +129,38 @@
              (t/testing "while :r4 was kept with borderRadius.sm"
                (t/is (= (:r4 (:applied-tokens rect-1')) (:name token-sm)))))))))))
 
+(t/deftest test-apply-color
+  (t/testing "applies color token and updates the shape fill and stroke-color"
+    (t/async
+     done
+     (let [color-token {:name "color.primary"
+                        :value "red"
+                        :type :color}
+           file (-> (setup-file-with-tokens)
+                    (update-in [:data :tokens-lib]
+                               #(ctob/add-token-in-set % "Set A" (ctob/make-token color-token))))
+           store (ths/setup-store file)
+           rect-1 (cths/get-shape file :rect-1)
+           events [(wtch/apply-token {:shape-ids [(:id rect-1)]
+                                      :attributes #{:color}
+                                      :token (toht/get-token file "color.primary")
+                                      :on-update-shape wtch/update-fill})
+                   (wtch/apply-token {:shape-ids [(:id rect-1)]
+                                      :attributes #{:stroke-color}
+                                      :token (toht/get-token file "color.primary")
+                                      :on-update-shape wtch/update-stroke-color})]]
+       (tohs/run-store-async
+        store done events
+        (fn [new-state]
+          (let [file' (ths/get-file-from-store new-state)
+                token-target' (toht/get-token file' "rotation.medium")
+                rect-1' (cths/get-shape file' :rect-1)]
+            (t/is (some? (:applied-tokens rect-1')))
+            (t/is (= (:fill (:applied-tokens rect-1')) (:name token-target')))
+            (t/is (= (get-in rect-1' [:fills 0 :fill-color]) "#ff0000"))
+            (t/is (= (:stroke (:applied-tokens rect-1')) (:name token-target')))
+            (t/is (= (get-in rect-1' [:strokes 0 :stroke-color]) "#ff0000")))))))))
+
 (t/deftest test-apply-dimensions
   (t/testing "applies dimensions token and updates the shapes width and height"
     (t/async

From b9ada1f520ea280749e1334250bc065ee5a34ecd Mon Sep 17 00:00:00 2001
From: Florian Schroedl <flo.schroedl@gmail.com>
Date: Tue, 3 Dec 2024 17:58:30 +0100
Subject: [PATCH 2/2] =?UTF-8?q?=F0=9F=90=9B=20Fix=20color=20token=20only?=
 =?UTF-8?q?=20applying=20fill?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/app/main/ui/workspace/tokens/changes.cljs    | 8 ++++++++
 .../src/app/main/ui/workspace/tokens/token_types.cljs     | 5 +++--
 frontend/src/app/main/ui/workspace/tokens/update.cljs     | 3 +--
 3 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/frontend/src/app/main/ui/workspace/tokens/changes.cljs b/frontend/src/app/main/ui/workspace/tokens/changes.cljs
index 3cea08e69..e0c0f0910 100644
--- a/frontend/src/app/main/ui/workspace/tokens/changes.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/changes.cljs
@@ -143,6 +143,14 @@
   [value shape-ids]
   (update-color wdc/change-stroke value shape-ids))
 
+(defn update-fill-stroke [value shape-ids attributes]
+  (ptk/reify ::update-fill-stroke
+    ptk/WatchEvent
+    (watch [_ _ _]
+      (rx/of
+       (when (:fill attributes) (update-fill value shape-ids))
+       (when (:stroke-color attributes) (update-stroke-color value shape-ids))))))
+
 (defn update-shape-dimensions [value shape-ids attributes]
   (ptk/reify ::update-shape-dimensions
     ptk/WatchEvent
diff --git a/frontend/src/app/main/ui/workspace/tokens/token_types.cljs b/frontend/src/app/main/ui/workspace/tokens/token_types.cljs
index b8247a288..f5979add4 100644
--- a/frontend/src/app/main/ui/workspace/tokens/token_types.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/token_types.cljs
@@ -23,8 +23,9 @@
 
    :color
    {:title "Color"
-    :attributes ctt/color-keys
-    :on-update-shape wtch/update-fill
+    :attributes #{:fill}
+    :all-attributes ctt/color-keys
+    :on-update-shape wtch/update-fill-stroke
     :modal {:key :tokens/color
             :fields [{:label "Color" :key :color}]}}
 
diff --git a/frontend/src/app/main/ui/workspace/tokens/update.cljs b/frontend/src/app/main/ui/workspace/tokens/update.cljs
index bc85bea83..2d4120b01 100644
--- a/frontend/src/app/main/ui/workspace/tokens/update.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/update.cljs
@@ -19,8 +19,7 @@
 (def attributes->shape-update
   {#{:rx :ry} (fn [v ids _] (wtch/update-shape-radius-all v ids))
    #{:r1 :r2 :r3 :r4} wtch/update-shape-radius-single-corner
-   #{:fill} wtch/update-fill
-   #{:stroke-color} wtch/update-stroke-color
+   ctt/color-keys wtch/update-fill-stroke
    ctt/stroke-width-keys wtch/update-stroke-width
    ctt/sizing-keys wtch/update-shape-dimensions
    ctt/opacity-keys wtch/update-opacity