diff --git a/frontend/src/app/main/ui/context.cljs b/frontend/src/app/main/ui/context.cljs
index 1aa4b532be..009366257e 100644
--- a/frontend/src/app/main/ui/context.cljs
+++ b/frontend/src/app/main/ui/context.cljs
@@ -31,3 +31,5 @@
 (def workspace-read-only? (mf/create-context nil))
 (def is-component?        (mf/create-context false))
 (def sidebar (mf/create-context nil))
+
+(def token-sets (mf/create-context nil))
diff --git a/frontend/src/app/main/ui/workspace/tokens/sets.cljs b/frontend/src/app/main/ui/workspace/tokens/sets.cljs
index 31a7e90db5..463a6f72ff 100644
--- a/frontend/src/app/main/ui/workspace/tokens/sets.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/sets.cljs
@@ -14,7 +14,8 @@
    [app.util.dom :as dom]
    [app.util.keyboard :as kbd]
    [cuerdas.core :as str]
-   [rumext.v2 :as mf]))
+   [rumext.v2 :as mf]
+   [app.main.ui.workspace.tokens.sets-context :as sets-context]))
 
 (def ^:private chevron-icon
   (i/icon-xref :arrow (stl/css :chevron-icon)))
@@ -29,9 +30,8 @@
   (dom/stop-propagation event)
   (st/emit! (wdt/delete-token-set id)))
 
-(defn on-rename-token-set [name token-set]
-  (let [new-token-set (assoc token-set :name name)]
-    (st/emit! (wdt/update-token-set new-token-set))))
+(defn on-update-token-set [token-set]
+  (st/emit! (wdt/update-token-set token-set)))
 
 (mf/defc editing-node
   [{:keys [default-value on-cancel on-submit]}]
@@ -58,7 +58,7 @@
       :default-value default-value}]))
 
 (mf/defc sets-tree
-  [{:keys [token-set token-set-active? token-set-selected? on-select on-toggle editing? set-editing-node on-rename] :as _props}]
+  [{:keys [token-set token-set-active? token-set-selected? editing? on-select on-toggle on-edit on-submit on-cancel] :as _props}]
   (let [{:keys [id name _children]} token-set
         selected? (and set? (token-set-selected? id))
         visible? (token-set-active? id)
@@ -71,15 +71,10 @@
                    (fn [event]
                      (dom/stop-propagation event)
                      (when-not editing-node?
-                       (on-select id))))
-        on-edit (mf/use-callback
-                 (mf/deps editing-node?)
-                 (fn [event]
-                   (dom/stop-propagation event)
-                   (set-editing-node id)))]
+                       (on-select id))))]
     [:div {:class (stl/css :set-item-container)
            :on-click on-select
-           :on-double-click on-edit}
+           :on-double-click #(on-edit id)}
      [:div {:class (stl/css-case :set-item-group group?
                                  :set-item-set set?
                                  :selected-set selected?)}
@@ -92,10 +87,8 @@
        (if set? i/document i/group)]
       (if editing-node?
         [:& editing-node {:default-value name
-                          :on-submit #(do
-                                        (on-rename % token-set)
-                                        (set-editing-node nil))
-                          :on-cancel #(set-editing-node nil)}]
+                          :on-submit #(on-submit (assoc token-set :name %))
+                          :on-cancel on-cancel}]
         [:*
          [:div {:class (stl/css :set-name)} name]
          [:div {:class (stl/css :delete-set)}
@@ -118,20 +111,29 @@
                                        :selected-set-id selected-token-set-id)])]))])]]))
 
 (mf/defc controlled-sets-list
-  [{:keys [token-sets] :as props}]
-  (let [editing-id (mf/use-state nil)
-        editing? (mf/use-callback
-                  (mf/deps editing-id)
-                  #(= @editing-id %))
-        set-editing-node #(reset! editing-id %)]
+  [{:keys [token-sets on-rename] :as props}]
+  (let [{:keys [editing? new? on-edit on-reset]} (sets-context/use-context)]
     [:ul {:class (stl/css :sets-list)}
      (for [[id token-set] token-sets]
        [:& sets-tree (-> (assoc props
                                 :key id
                                 :token-set token-set
                                 :editing? editing?
-                                :set-editing-node set-editing-node)
-                         (dissoc :token-sets))])]))
+                                :set-editing-node on-edit
+                                :on-edit on-edit
+                                :on-submit #(do
+                                              (on-rename %)
+                                              (on-reset))
+                                :on-cancel on-reset)
+                         (dissoc :token-sets))])
+     (when new?
+       [:& sets-tree {:token-set {}
+                      :token-set-active? (constantly true)
+                      :token-set-selected? (constantly true)
+                      :on-select identity
+                      :editing? (constantly true)
+                      :set-editing-node on-edit}])]))
+
 
 (mf/defc sets-list
   [{:keys []}]
@@ -153,4 +155,4 @@
       :token-set-active? token-set-active?
       :on-select on-select-token-set-click
       :on-toggle on-toggle-token-set-click
-      :on-rename on-rename-token-set}]))
+      :on-rename on-update-token-set}]))
diff --git a/frontend/src/app/main/ui/workspace/tokens/sets_context.cljs b/frontend/src/app/main/ui/workspace/tokens/sets_context.cljs
new file mode 100644
index 0000000000..0d08ab2971
--- /dev/null
+++ b/frontend/src/app/main/ui/workspace/tokens/sets_context.cljs
@@ -0,0 +1,34 @@
+(ns app.main.ui.workspace.tokens.sets-context
+  (:require
+   [rumext.v2 :as mf]))
+
+(def initial {:editing-id nil
+              :new? false})
+
+(def context (mf/create-context initial))
+
+(mf/defc provider
+  {::mf/wrap-props false}
+  [props]
+  (let [children (unchecked-get props "children")
+        state (mf/use-state initial)]
+    [:& (mf/provider context) {:value state}
+     children]))
+
+(defn use-context []
+  (let [ctx (mf/use-ctx context)
+        {:keys [editing-id new?]} @ctx
+        editing? (mf/use-callback
+                  (mf/deps editing-id)
+                  #(= editing-id %))
+        on-edit (mf/use-fn
+                 #(swap! ctx assoc :editing-id %))
+        on-create (mf/use-fn
+                   #(swap! ctx assoc :editing-id (random-uuid) :new? true))
+        on-reset (mf/use-fn
+                  #(reset! ctx initial))]
+    {:editing? editing?
+     :new? new?
+     :on-edit on-edit
+     :on-create on-create
+     :on-reset on-reset}))
diff --git a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs
index 9c1e536dd6..b26a699563 100644
--- a/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs
+++ b/frontend/src/app/main/ui/workspace/tokens/sidebar.cljs
@@ -9,12 +9,12 @@
   (:require
    [app.common.data :as d]
    [app.main.data.modal :as modal]
-   [app.main.ui.workspace.tokens.theme-select :refer [theme-select]]
    [app.main.data.tokens :as dt]
    [app.main.data.tokens :as wdt]
    [app.main.refs :as refs]
    [app.main.store :as st]
    [app.main.ui.components.title-bar :refer [title-bar]]
+   [app.main.ui.context :as muc]
    [app.main.ui.icons :as i]
    [app.main.ui.workspace.sidebar.assets.common :as cmm]
    [app.main.ui.workspace.tokens.changes :as wtch]
@@ -22,7 +22,9 @@
    [app.main.ui.workspace.tokens.context-menu :refer [token-context-menu]]
    [app.main.ui.workspace.tokens.core :as wtc]
    [app.main.ui.workspace.tokens.sets :refer [sets-list]]
+   [app.main.ui.workspace.tokens.sets-context :as sets-context]
    [app.main.ui.workspace.tokens.style-dictionary :as sd]
+   [app.main.ui.workspace.tokens.theme-select :refer [theme-select]]
    [app.main.ui.workspace.tokens.token :as wtt]
    [app.main.ui.workspace.tokens.token-types :as wtty]
    [app.util.dom :as dom]
@@ -198,23 +200,30 @@
      [:& theme-select]
      [:& edit-button {:create? (empty? ordered-themes)}]]]))
 
+(mf/defc add-set-button
+  [{:keys [on-open]}]
+  (let [{:keys [on-create]} (sets-context/use-context)]
+    [:button {:class (stl/css :add-set)
+              :on-click #(do
+                           (on-open)
+                           (on-create))}
+     i/add]))
+
 (mf/defc sets-sidebar
   []
-  (let [open? (mf/use-state true)]
-    [:div {:class (stl/css :sets-sidebar)}
-     [:div {:class (stl/css :sidebar-header)}
-      [:& title-bar {:collapsable true
-                     :collapsed (not @open?)
-                     :all-clickable true
-                     :title "SETS"
-                     :on-collapsed #(swap! open? not)}]
-      [:button {:class (stl/css :add-set)
-                :on-click #(do
-                             (reset! open? true)
-                             (on-set-add-click %))}
-       i/add]]
-     (when @open?
-       [:& sets-list])]))
+  (let [open? (mf/use-state true)
+        on-open (mf/use-fn #(reset! open? true))]
+    [:& sets-context/provider {}
+     [:div {:class (stl/css :sets-sidebar)}
+      [:div {:class (stl/css :sidebar-header)}
+       [:& title-bar {:collapsable true
+                      :collapsed (not @open?)
+                      :all-clickable true
+                      :title "SETS"
+                      :on-collapsed #(swap! open? not)}
+        [:& add-set-button {:on-open on-open}]]]
+      (when @open?
+        [:& sets-list])]]))
 
 (mf/defc tokens-explorer
   [_props]