🔥 Remove binary fills flag (#7462)

* 🐛 Add missing IEmptyableCollection protocol impl for wasm Shape

* 🔥 Remove frontend-binary-fills flag

* ✨ Fix fill-limit integration tests

---------

Co-authored-by: Belén Albeza <belen@hey.com>

common/src/app/common/flags.cljc

@@ -134,7 +134,6 @@
     :hide-release-modal
     :subscriptions
     :subscriptions-old
-    :frontend-binary-fills
     :inspect-styles
 
     ;; Security layer middleware that filters request by fetch

frontend/playwright/ui/specs/colorpicker.spec.js

@@ -93,7 +93,9 @@ test("Create a LINEAR gradient", async ({ page }) => {
   await expect(inputOpacityGlobal).toHaveValue("50");
   await expect(inputOpacityGlobal).toBeVisible();
 
-  await expect(workspacePage.page.getByText("Linear gradient").nth(1)).toBeVisible();
+  await expect(
+    workspacePage.page.getByText("Linear gradient").nth(1),
+  ).toBeVisible();
 });
 
 test("Create a RADIAL gradient", async ({ page }) => {
@@ -175,12 +177,14 @@ test("Create a RADIAL gradient", async ({ page }) => {
   await expect(inputOpacityGlobal).toHaveValue("50");
   await expect(inputOpacityGlobal).toBeVisible();
 
-  await expect(workspacePage.page.getByText("Radial gradient").nth(1)).toBeVisible();
+  await expect(
+    workspacePage.page.getByText("Radial gradient").nth(1),
+  ).toBeVisible();
 });
 
 test("Gradient stops limit", async ({ page }) => {
   const workspacePage = new WorkspacePage(page);
-  await workspacePage.mockConfigFlags(["enable-frontend-binary-fills"]);
+  await workspacePage.mockConfigFlags(["enable-feature-render-wasm"]);
   await workspacePage.setupEmptyFile(page);
 
   await workspacePage.mockRPC(

frontend/playwright/ui/specs/design-tab.spec.js

@@ -71,7 +71,7 @@ test.describe("Shape attributes", () => {
     page,
   }) => {
     const workspace = new WorkspacePage(page);
-    await workspace.mockConfigFlags(["enable-frontend-binary-fills"]);
+    await workspace.mockConfigFlags(["enable-feature-render-wasm"]);
     await workspace.setupEmptyFile();
     await workspace.mockRPC(/get\-file\?/, "design/get-file-fills-limit.json");
 

frontend/src/app/main/data/workspace.cljs

@@ -20,10 +20,8 @@
    [app.common.path-names :as cpn]
    [app.common.transit :as t]
    [app.common.types.component :as ctc]
-   [app.common.types.fills :as types.fills]
    [app.common.types.shape :as cts]
    [app.common.uuid :as uuid]
-   [app.config :as cf]
    [app.main.data.changes :as dch]
    [app.main.data.comments :as dcmt]
    [app.main.data.common :as dcm]
@@ -78,7 +76,6 @@
    [app.util.timers :as tm]
    [app.util.webapi :as wapi]
    [beicon.v2.core :as rx]
-   [clojure.walk :as walk]
    [cuerdas.core :as str]
    [potok.v2.core :as ptk]))
 
@@ -131,25 +128,6 @@
                                         (rx/of [k v])))))))
        (rx/reduce conj {})))
 
-
-(defn process-fills
-  "A function responsible to analyze the file data or shape for references
-  and apply lookup-index on it."
-  [data]
-  (letfn [(process-map-form [form]
-            (let [fills (get form :fills)]
-              (if (vector? fills)
-                (assoc form :fills (types.fills/from-plain fills))
-                form)))
-
-          (process-form [form]
-            (if (map? form)
-              (process-map-form form)
-              form))]
-    (if (contains? cf/flags :frontend-binary-fills)
-      (walk/postwalk process-form data)
-      data)))
-
 (defn- resolve-file
   [file]
   (log/inf :hint "resolve file"
@@ -157,7 +135,6 @@
            :features (str/join " " (:features file)))
   (->> (fpmap/resolve-file file)
        (rx/map :data)
-       (rx/map process-fills)
        (rx/map
         (fn [data]
           (assoc file :data (d/removem (comp t/pointer? val) data))))))
@@ -187,9 +164,6 @@
     (update [_ state]
       (update state :files assoc (:id library) library))))
 
-
-
-
 (defn- fetch-libraries
   [file-id features]
   (ptk/reify ::fetch-libries

frontend/src/app/main/data/workspace/colors.cljs

@@ -16,7 +16,6 @@
    [app.common.types.shape :as shp]
    [app.common.types.shape.shadow :refer [check-shadow]]
    [app.common.types.text :as txt]
-   [app.config :as cfg]
    [app.main.broadcast :as mbc]
    [app.main.data.helpers :as dsh]
    [app.main.data.modal :as md]
@@ -899,7 +898,7 @@
     (update [_ state]
       (update state :colorpicker
               (fn [{:keys [stops editing-stop] :as state}]
-                (let [cap-stops? (or (features/active-feature? state "render-wasm/v1") (contains? cfg/flags :frontend-binary-fills))
+                (let [cap-stops?    (features/active-feature? state "render-wasm/v1")
                       can-add-stop? (or (not cap-stops?) (< (count stops) types.fills/MAX-GRADIENT-STOPS))]
                   (if can-add-stop?
                     (if (clr/uniform-spread? stops)
@@ -945,9 +944,9 @@
       (update state :colorpicker
               (fn [state]
                 (let [stops (:stops state)
+
                       cap-stops?
-                      (or (features/active-feature? state "render-wasm/v1")
+                      (features/active-feature? state "render-wasm/v1")
-                          (contains? cfg/flags :frontend-binary-fills))
 
                       can-add-stop?
                       (or (not cap-stops?) (< (count stops) types.fills/MAX-GRADIENT-STOPS))]
@@ -972,8 +971,7 @@
       (update state :colorpicker
               (fn [state]
                 (let [stop  (or (:editing-stop state) 0)
-                      cap-stops? (or (features/active-feature? state "render-wasm/v1")
+                      cap-stops? (features/active-feature? state "render-wasm/v1")
-                                     (contains? cfg/flags :frontend-binary-fills))
                       stops (mapv split-color-components
                                   (if cap-stops?
                                     (take types.fills/MAX-GRADIENT-STOPS stops)

frontend/src/app/main/ui/workspace/colorpicker.cljs

@@ -349,10 +349,6 @@
         render-wasm?
         (features/use-feature "render-wasm/v1")
 
-        cap-stops?
-        (or ^boolean render-wasm?
-            ^boolean (contains? cfg/flags :frontend-binary-fills))
-
         tabs
         (mf/with-memo []
           [{:aria-label (tr "workspace.libraries.colors.rgba")
@@ -447,7 +443,7 @@
          (when (= selected-mode :gradient)
            [:> gradients*
             {:type (:type state)
-             :stops (if cap-stops? (vec (take types.fills/MAX-GRADIENT-STOPS (:stops state))) (:stops state))
+             :stops (if render-wasm? (vec (take types.fills/MAX-GRADIENT-STOPS (:stops state))) (:stops state))
              :editing-stop (:editing-stop state)
              :on-stop-edit-start handle-stop-edit-start
              :on-stop-edit-finish handle-stop-edit-finish
@@ -644,13 +640,13 @@
 
 (defn- combine-groups-with-resolved
   "Replaces token names in grouped sets with their full resolved token objects.
-  
+
      Input:
      - groups: [{:group \"brand\"
                  :sets [\"light\" \"dark\"]
                  :tokens [\"background\" \"foreground\"]} ...]
      - resolved-tokens: [{:name \"background\" :type \"color\" :value \"{red-100}\" ...} ...]
-  
+
      Output:
      [{:group \"brand\"
        :sets [\"light\" \"dark\"]
@@ -672,11 +668,11 @@
 
 (defn- filter-non-empty-sets
   "Removes sets that have no tokens.
-  
+
    Input:
    [{:set \"brand/light\" :tokens []}
     {:set \"brand/dark\"  :tokens [{:name \"background\"}]}]
-  
+
    Output:
    [{:set \"brand/dark\" :tokens [{:name \"background\"}]}]"
   [sets]
@@ -686,11 +682,11 @@
 
 (defn- add-tokens-to-sets
   "Extracts set name and its tokens from raw set objects.
-  
+
      Input:
      A vector of set objects (raw domain type), each compatible with:
      {:id ... :name \"brand/light\" :tokens {...}}
-  
+
      Output:
      A vector of simplified maps:
      [{:set \"brand/light\" :tokens [{:name \"background\" ...} ...]}]"
@@ -703,14 +699,14 @@
 
 (defn- filter-active-sets
   "Filters sets to only include those whose :set value is in active-set-names.
-  
+
      Input:
      - sets: [{:set \"brand/light\" :tokens [...]},
               {:set \"brand/dark\" :tokens [...]},
               {:set \"primitivos\" :tokens [...]},
               ...]
      - active-set-names: #{\"brand/light\" \"primitivos\"}
-  
+
      Output:
      [{:set \"brand/light\" :tokens [...]}
       {:set \"primitivos\" :tokens [...]}]"

frontend/src/app/main/ui/workspace/colorpicker/gradients.cljs

@@ -12,7 +12,6 @@
    [app.common.math :as mth]
    [app.common.types.color :as cc]
    [app.common.types.fills :as types.fills]
-   [app.config :as cfg]
    [app.main.features :as features]
    [app.main.ui.components.numeric-input :refer [numeric-input*]]
    [app.main.ui.components.reorder-handler :refer [reorder-handler*]]
@@ -293,8 +292,12 @@
          (fn []
            (when on-reverse-stops
              (on-reverse-stops))))
-        cap-stops? (or (features/use-feature "render-wasm/v1") (contains? cfg/flags :frontend-binary-fills))
+
-        add-stop-disabled? (when cap-stops? (>= (count stops) types.fills/MAX-GRADIENT-STOPS))]
+        cap-stops?
+        (features/use-feature "render-wasm/v1")
+
+        add-stop-disabled?
+        (when cap-stops? (>= (count stops) types.fills/MAX-GRADIENT-STOPS))]
 
     [:div {:class (stl/css :gradient-panel)}
      [:div {:class (stl/css :gradient-preview)}

frontend/src/app/main/ui/workspace/sidebar/options/menus/fill.cljs

@@ -10,10 +10,10 @@
    [app.common.types.color :as clr]
    [app.common.types.fills :as types.fills]
    [app.common.types.shape.attrs :refer [default-color]]
-   [app.config :as cfg]
    [app.main.data.workspace :as udw]
    [app.main.data.workspace.colors :as dc]
    [app.main.data.workspace.tokens.application :as dwta]
+   [app.main.features :as feat]
    [app.main.store :as st]
    [app.main.ui.components.title-bar :refer [title-bar*]]
    [app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
@@ -29,25 +29,12 @@
   #{:fills :hide-fill-on-export})
 
 (def ^:private
-  xf:take-max-fills
+  xf:process-fills
-  (take types.fills/MAX-FILLS))
-
-(def ^:private
-  xf:enumerate
   (map-indexed
    (fn [index item]
      (let [color (types.fills/fill->color item)]
        (with-meta item {:index index :color color})))))
 
-(def ^:private ^boolean binary-fills-enabled?
-  (contains? cfg/flags :frontend-binary-fills))
-
-(def ^:private
-  xf:process-fills
-  (if binary-fills-enabled?
-    (comp xf:take-max-fills xf:enumerate)
-    xf:enumerate))
-
 (defn- prepare-fills
   "Internal helper hook that prepares fills"
   [fills]
@@ -88,6 +75,9 @@
         hide-on-export (get values :hide-fill-on-export false)
         fill-token-applied (:fill applied-tokens)
 
+        render-wasm?   (feat/use-feature "render-wasm/v1")
+
+
         ^boolean
         multiple?      (= :multiple fills)
 
@@ -109,7 +99,7 @@
         checkbox-ref   (mf/use-ref)
 
         can-add-fills?
-        (if binary-fills-enabled?
+        (if render-wasm?
           (and (not multiple?)
                (< (count fills) types.fills/MAX-FILLS))
           (not ^boolean multiple?))

frontend/src/app/main/ui/workspace/viewport/gradients.cljs

@@ -16,7 +16,6 @@
    [app.common.math :as mth]
    [app.common.types.color :as cc]
    [app.common.types.fills :as types.fills]
-   [app.config :as cfg]
    [app.main.data.workspace.colors :as dc]
    [app.main.features :as features]
    [app.main.refs :as refs]
@@ -134,8 +133,8 @@
 
         handler-state (mf/use-state {:display? false :offset 0 :hover nil})
 
-        cap-stops? (or (features/use-feature "render-wasm/v1") (contains? cfg/flags :frontend-binary-fills))
+        render-wasm?  (features/use-feature "render-wasm/v1")
-        can-add-stop? (if cap-stops? (< (count stops) types.fills/MAX-GRADIENT-STOPS) true)
+        can-add-stop? (if render-wasm? (< (count stops) types.fills/MAX-GRADIENT-STOPS) true)
 
         endpoint-on-pointer-down
         (fn [position event]
@@ -525,8 +524,8 @@
         shape        (mf/deref shape-ref)
         state        (mf/deref refs/colorpicker)
         gradient     (:gradient state)
-        cap-stops?   (or (features/use-feature "render-wasm/v1") (contains? cfg/flags :frontend-binary-fills))
+        render-wasm? (features/use-feature "render-wasm/v1")
-        stops        (if cap-stops?
+        stops        (if render-wasm?
                        (vec (take types.fills/MAX-GRADIENT-STOPS (:stops state)))
                        (:stops state))
         editing-stop (:editing-stop state)]

frontend/src/app/render_wasm/shape.cljs

@@ -53,6 +53,10 @@
   (-conj [coll entry]
     (impl-conj coll entry))
 
+  c/IEmptyableCollection
+  (-empty [_]
+    (ShapeProxy. nil nil nil))
+
   c/IEquiv
   (-equiv [coll other]
     (c/equiv-map coll other))
@@ -62,7 +66,6 @@
     (hash (into {} coll)))
 
   c/ISequential
-
   c/ISeqable
   (-seq [_]
     (cons (map-entry :id id)