✨ Add minor compatibility adjustments for audit archive task

Add the option to import tokens from a linked library.

I know there are plans to link the tokens in together with the library.
Once this happens this patch can be reverted. Until then it helps a lot
to use a design system that relies on themes.

Before that someones would need to:
* Download the design system / add to their team.
* Open the file, download the tokens.

For every new file:
* Link the Design System library.
* Import the tokens file.

With this patch all you need to get started is to download the design
system and add to your team. From their importing the links is done on
the same pop-up that is used to import the tokens.

---

Technical considerations:

I try adding this as a dialog that is called once the library is
imported. I ran into a few issues though:

* To find whether the library has tokens (and thus show the dialog) I
  would need to extend library summary to include tokens.
* I couldn't find a reliable way to import the tokens after importing
  the library without resorting to a timer :/

I'm sure both of those hurdles are doable, I just wasted enough time
trying it to the point I decided on a different approach.

Signed-off-by: Dalai Felinto <dalai@blender.org>

📎 Fix minor issues and linter reports

📎 Reuse translations

.gitignore

@@ -69,7 +69,7 @@
 /frontend/test-results/
 /other/
 /scripts/
-/telemetry/
+/nexus/
 /tmp/
 /vendor/**/target
 /vendor/svgclean/bundle*.js

CHANGES.md

@@ -10,10 +10,12 @@
 
 ### :sparkles: New features & Enhancements
 
+- Allow duplicating color and typography styles (by @MkDev11) [Github #2912](https://github.com/penpot/penpot/issues/2912)
 - Add MCP server integration [Taiga #13112](https://tree.taiga.io/project/penpot/us/13112), [Taiga #13114](https://tree.taiga.io/project/penpot/us/13114)
 - Add woff2 support on user uploaded fonts (by @Nivl) [Github #8248](https://github.com/penpot/penpot/pull/8248)
 - Option to download custom fonts (by @dfelinto) [Github #8320](https://github.com/penpot/penpot/issues/8320)
 - Add copy as image to clipboard option to workspace context menu (by @dfelinto) [Github #8313](https://github.com/penpot/penpot/pull/8313)
+- Import Tokens from linked library [Github #8391](https://github.com/penpot/penpot/pull/8391)
 
 ### :bug: Bugs fixed
 
@@ -52,6 +54,7 @@
 - Fix viewer can update library [Taiga #13186](https://tree.taiga.io/project/penpot/issue/13186)
 - Fix remove fill affects different element than selected [Taiga #13128](https://tree.taiga.io/project/penpot/issue/13128)
 - Fix unable to finish the create account form using keyboard [Taiga #11333](https://tree.taiga.io/project/penpot/issue/11333)
+- Fix 45 rotated board titles rendered incorrectly [Taiga #13306](https://tree.taiga.io/project/penpot/issue/13306)
 
 ## 2.13.3
 

backend/scripts/_env

@@ -2,6 +2,7 @@
 
 export PENPOT_NITRATE_SHARED_KEY=super-secret-nitrate-api-key
 export PENPOT_EXPORTER_SHARED_KEY=super-secret-exporter-api-key
+export PENPOT_NEXUS_SHARED_KEY=super-secret-nexus-api-key
 export PENPOT_SECRET_KEY=super-secret-devenv-key
 
 # DEPRECATED: only used for subscriptions

backend/src/app/config.clj

@@ -103,6 +103,7 @@
 
     [:exporter-shared-key {:optional true} :string]
     [:nitrate-shared-key {:optional true} :string]
+    [:nexus-shared-key {:optional true} :string]
     [:management-api-key {:optional true} :string]
 
     [:telemetry-uri {:optional true} :string]

backend/src/app/loggers/audit.clj

@@ -120,7 +120,7 @@
 ;; an external storage and data cleared.
 
 (def ^:private schema:event
-  [:map {:title "event"}
+  [:map {:title "AuditEvent"}
    [::type ::sm/text]
    [::name ::sm/text]
    [::profile-id ::sm/uuid]

backend/src/app/loggers/audit/archive_task.clj

@@ -10,14 +10,11 @@
    [app.common.logging :as l]
    [app.common.schema :as sm]
    [app.common.transit :as t]
-   [app.common.uuid :as uuid]
    [app.config :as cf]
    [app.db :as db]
    [app.http.client :as http]
    [app.setup :as-alias setup]
-   [app.tokens :as tokens]
    [integrant.core :as ig]
-   [lambdaisland.uri :as u]
    [promesa.exec :as px]))
 
 ;; This is a task responsible to send the accumulated events to
@@ -52,19 +49,18 @@
 
 (defn- send!
   [{:keys [::uri] :as cfg} events]
-  (let [token   (tokens/generate cfg
-                                 {:iss "authentication"
-                                  :uid uuid/zero})
+  (let [skey    (-> cfg ::setup/shared-keys :nexus)
         body    (t/encode {:events events})
         headers {"content-type" "application/transit+json"
                  "origin" (str (cf/get :public-uri))
-                 "cookie" (u/map->query-string {:auth-token token})}
+                 "x-shared-key" (str "nexus " skey)}
         params  {:uri uri
                  :timeout 12000
                  :method :post
                  :headers headers
                  :body body}
         resp    (http/req! cfg params)]
+
     (if (= (:status resp) 204)
       true
       (do
@@ -109,7 +105,7 @@
 (def ^:private schema:handler-params
   [:map
    ::db/pool
-   ::setup/props
+   ::setup/shared-keys
    ::http/client])
 
 (defmethod ig/assert-key ::handler

backend/src/app/main.clj

@@ -466,16 +466,17 @@
 
    ::setup/shared-keys
    {::setup/props (ig/ref ::setup/props)
-    :nitrate (cf/get :nitrate-shared-key)
-    :exporter (cf/get :exporter-shared-key)}
+    :nexus        (cf/get :nexus-shared-key)
+    :nitrate      (cf/get :nitrate-shared-key)
+    :exporter     (cf/get :exporter-shared-key)}
 
    ::setup/clock
    {}
 
    :app.loggers.audit.archive-task/handler
-   {::setup/props        (ig/ref ::setup/props)
-    ::db/pool            (ig/ref ::db/pool)
-    ::http.client/client (ig/ref ::http.client/client)}
+   {::setup/shared-keys  (ig/ref ::setup/shared-keys)
+    ::http.client/client (ig/ref ::http.client/client)
+    ::db/pool            (ig/ref ::db/pool)}
 
    :app.loggers.audit.gc-task/handler
    {::db/pool (ig/ref ::db/pool)}

backend/src/app/nitrate.clj

@@ -126,7 +126,8 @@
   [cfg profile]
   (try
     (let [nitrate-licence (call cfg :is-valid-user {:profile-id (:id profile)})]
-      (assoc profile :nitrate-licence (:valid nitrate-licence)))
+      (assoc-in profile [:props :nitrate-license]
+                (select-keys nitrate-licence [:valid :created-at])))
     (catch Throwable cause
       (l/error :hint "failed to get nitrate licence"
                :profile-id (:id profile)

backend/src/app/setup.clj

@@ -82,45 +82,37 @@
   (db/tx-run! cfg (fn [{:keys [::db/conn]}]
                     (db/xact-lock! conn 0)
                     (when-not key
-                      (l/warn :hint (str "using autogenerated secret-key, it will change on each restart and will invalidate "
-                                         "all sessions on each restart, it is highly recommended setting up the "
-                                         "PENPOT_SECRET_KEY environment variable")))
+                      (l/wrn :hint (str "using autogenerated secret-key, it will change "
+                                        "on each restart and will invalidate "
+                                        "all sessions on each restart, it is highly "
+                                        "recommended setting up the "
+                                        "PENPOT_SECRET_KEY environment variable")))
                     (let [secret (or key (generate-random-key))]
                       (-> (get-all-props conn)
                           (assoc :secret-key secret)
                           (assoc :tokens-key (keys/derive secret :salt "tokens"))
                           (update :instance-id handle-instance-id conn (db/read-only? pool)))))))
 
-(sm/register! ::props [:map-of :keyword ::sm/any])
-
-
 (defmethod ig/init-key ::shared-keys
   [_ {:keys [::props] :as cfg}]
   (let [secret (get props :secret-key)]
-    (d/without-nils
-     {:exporter
-      (let [key (or (get cfg :exporter)
-                    (-> (keys/derive secret :salt "exporter")
-                        (bc/bytes->b64-str true)))]
-        (if (or (str/empty? key)
-                (str/blank? key))
-          (do
-            (l/wrn :hint "exporter key is disabled because empty string found")
-            nil)
-          (do
-            (l/inf :hint "exporter key initialized" :key (d/obfuscate-string key))
-            key)))
+    (reduce (fn [keys id]
+              (let [key (or (get cfg id)
+                            (-> (keys/derive secret :salt (name id))
+                                (bc/bytes->b64-str true)))]
+                (if (or (str/empty? key)
+                        (str/blank? key))
+                  (do
+                    (l/wrn :id (name id) :hint "key is disabled because empty string found")
+                    keys)
+                  (do
+                    (l/inf :id (name id) :hint "key initialized" :key (d/obfuscate-string key))
+                    (assoc keys id key)))))
+            {}
+            [:exporter
+             :nitrate
+             :nexus])))
 
-      :nitrate
-      (let [key (or (get cfg :nitrate)
-                    (-> (keys/derive secret :salt "nitrate")
-                        (bc/bytes->b64-str true)))]
-        (if (or (str/empty? key)
-                (str/blank? key))
-          (do
-            (l/wrn :hint "nitrate key is disabled because empty string found")
-            nil)
-          (do
-            (l/inf :hint "nitrate key initialized" :key (d/obfuscate-string key))
-            key)))})))
+(sm/register! ::props [:map-of :keyword ::sm/any])
+(sm/register! ::shared-keys [:map-of :keyword ::sm/text])
 

common/src/app/common/flags.cljc

@@ -119,12 +119,13 @@
     :strict-session-cookies
     :telemetry
     :terms-and-privacy-checkbox
-    ;; Only for developtment.
     :tiered-file-data-storage
     :token-base-font-size
     :token-color
     :token-shadow
     :token-tokenscript
+    :token-import-from-library
+    ;; Only for developtment.
     :transit-readable-response
     :user-feedback
     ;; TODO: remove this flag.
@@ -180,7 +181,8 @@
    :enable-token-color
    :enable-token-shadow
    :enable-inspect-styles
-   :enable-feature-fdata-objects-map])
+   :enable-feature-fdata-objects-map
+   :enable-token-import-from-library])
 
 (defn parse
   [& flags]

common/src/app/common/schema.cljc

@@ -5,7 +5,7 @@
 ;; Copyright (c) KALEIDOS INC
 
 (ns app.common.schema
-  (:refer-clojure :exclude [deref merge parse-uuid parse-long parse-double parse-boolean type keys])
+  (:refer-clojure :exclude [deref merge parse-uuid parse-long parse-double parse-boolean type keys select-keys])
   #?(:cljs (:require-macros [app.common.schema :refer [ignoring]]))
   (:require
    #?(:clj [malli.dev.pretty :as mdp])
@@ -93,6 +93,11 @@
   [& items]
   (apply mu/merge (map schema items)))
 
+(defn select-keys
+  [s keys & {:as opts}]
+  (let [s (schema s)]
+    (mu/select-keys s keys opts)))
+
 (defn assoc-key
   "Add a key & value to a schema of type [:map]. If the first level node of the schema
    is not a map, will do a depth search to find the first map node and add the key there."
@@ -138,10 +143,10 @@
    (mu/optional-keys schema keys default-options)))
 
 (defn required-keys
-  ([schema]
-   (mu/required-keys schema nil default-options))
-  ([schema keys]
-   (mu/required-keys schema keys default-options)))
+  ([s]
+   (mu/required-keys (schema s) nil default-options))
+  ([s keys]
+   (mu/required-keys (schema s) keys default-options)))
 
 (defn transformer
   [& transformers]
@@ -646,7 +651,7 @@
        {:title "set"
         :description "Set of Strings"
         :error/message "should be a set of strings"
-        :gen/gen (-> kind sg/generator sg/set)
+        :gen/gen (sg/mcat (fn [_] (sg/generator kind)) sg/int)
         :decode/string decode
         :decode/json decode
         :encode/string encode-string

common/src/app/common/time.cljc

@@ -28,6 +28,7 @@
               ["date-fns/locale/eu$default" :as dfn-eu]
               ["date-fns/locale/fa-IR$default" :as dfn-fa-ir]
               ["date-fns/locale/fr$default" :as dfn-fr]
+              ["date-fns/locale/fr-CA$default" :as dfn-fr-ca]
               ["date-fns/locale/gl$default" :as dfn-gl]
               ["date-fns/locale/he$default" :as dfn-he]
               ["date-fns/locale/hr$default" :as dfn-hr]
@@ -252,6 +253,7 @@
           :fa dfn-fa-ir
           :fa_ir dfn-fa-ir
           :fr dfn-fr
+          :fr_ca dfn-fr-ca
           :he dfn-he
           :pt dfn-pt
           :pt_pt dfn-pt

frontend/scripts/_helpers.js

@@ -288,6 +288,7 @@ export async function compileTranslations() {
     "es",
     "fa",
     "fr",
+    "fr_CA",
     "he",
     "sr",
     "nb_NO",

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

@@ -2,6 +2,9 @@
   (:require
    [app.main.data.modal :as modal]
    [app.main.repo :as rp]
+   [app.main.router :as rt]
+   [app.main.store :as st]
+   [app.util.dom :as dom]
    [beicon.v2.core :as rx]
    [potok.v2.core :as ptk]))
 
@@ -14,4 +17,12 @@
            (rx/map (fn [connectivity]
                      (modal/show popup-type (or connectivity {}))))))))
 
+(defn go-to-nitrate-cc
+  []
+  (st/emit! (dom/open-new-window "/control-center/")))
+
+(defn go-to-nitrate-billing
+  []
+  (st/emit! (rt/nav-raw :href "/control-center/licenses/billing")))
+
 

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

@@ -221,6 +221,24 @@
                         (pcb/delete-color id))]
         (rx/of (dch/commit-changes changes))))))
 
+(defn duplicate-color
+  [file-id color-id]
+  (assert (uuid? file-id) "expected valid uuid for `file-id`")
+  (assert (uuid? color-id) "expected valid uuid for `color-id`")
+
+  (ptk/reify ::duplicate-color
+    ptk/WatchEvent
+    (watch [it state _]
+      (let [data      (dsh/lookup-file-data state)
+            color     (ctl/get-color data color-id)
+            new-color (-> color
+                          (assoc :id (uuid/next))
+                          (d/without-nils)
+                          (ctc/check-library-color))
+            changes   (-> (pcb/empty-changes it)
+                          (pcb/add-color new-color))]
+        (rx/of (dch/commit-changes changes))))))
+
 ;; FIXME: this should be deleted
 (defn add-media
   [media]
@@ -350,6 +368,23 @@
                         (pcb/delete-typography id))]
         (rx/of (dch/commit-changes changes))))))
 
+(defn duplicate-typography
+  [file-id typography-id]
+  (assert (uuid? file-id) "expected valid uuid for `file-id`")
+  (assert (uuid? typography-id) "expected valid uuid for `typography-id`")
+
+  (ptk/reify ::duplicate-typography
+    ptk/WatchEvent
+    (watch [it state _]
+      (let [data           (dsh/lookup-file-data state)
+            typography     (get-in data [:typographies typography-id])
+            new-typography (-> typography
+                               (assoc :id (uuid/next))
+                               (ctt/check-typography))
+            changes        (-> (pcb/empty-changes it)
+                               (pcb/add-typography new-typography))]
+        (rx/of (dch/commit-changes changes))))))
+
 (defn- add-component2
   "This is the second step of the component creation."
   ([selected]

frontend/src/app/main/ui/dashboard/sidebar.cljs

@@ -302,9 +302,8 @@
         on-create-org-click
         (mf/use-fn
          (fn []
-           (if (:nitrate-licence profile)
-             ;; TODO update when org creation route is ready
-             (dom/open-new-window "/control-center/org/create")
+           (if (dm/get-in profile [:props :nitrate-license :valid])
+             (dnt/go-to-nitrate-cc)
              (st/emit! (dnt/show-nitrate-popup :nitrate-form)))))]
 
     [:> dropdown-menu* props
@@ -548,9 +547,8 @@
         on-create-org-click
         (mf/use-fn
          (fn []
-           (if (:nitrate-licence profile)
-             ;; TODO update when org creation route is ready
-             (dom/open-new-window "/control-center/org/create")
+           (if (dm/get-in profile [:props :nitrate-license :valid])
+             (dnt/go-to-nitrate-cc)
              (st/emit! (dnt/show-nitrate-popup :nitrate-form)))))]
     (if empty?
       [:div {:class (stl/css :nitrate-orgs-empty)}
@@ -1088,7 +1086,7 @@
 
     [:*
      (if (contains? cf/flags :nitrate)
-       (when-not (:nitrate-licence profile)
+       (when-not (dm/get-in profile [:props :nitrate-license :valid])
          [:> nitrate-sidebar* {:profile profile}])
        (when (contains? cf/flags :subscriptions)
          (if (show-subscription-dashboard-banner? profile)

frontend/src/app/main/ui/settings/subscription.cljs

@@ -360,6 +360,11 @@
   (let [route          (mf/deref refs/route)
         authenticated? (da/is-authenticated? profile)
 
+        nitrate-license (dm/get-in profile [:props :nitrate-license])
+
+        nitrate? (and (contains? cf/flags :nitrate)
+                      (:valid nitrate-license))
+
         params-subscription
         (-> route :params :query :subscription)
 
@@ -390,7 +395,9 @@
         (ct/format-inst (:created-at profile) "d MMMM, yyyy")
 
         subscribed-since
-        (ct/format-inst (:start-date subscription) "d MMMM, yyyy")
+        (if nitrate?
+          (ct/format-inst (:created-at nitrate-license) "d MMMM, yyyy")
+          (ct/format-inst (:start-date subscription) "d MMMM, yyyy"))
 
         go-to-pricing-page
         (mf/use-fn
@@ -468,60 +475,73 @@
 
       [:div {:class (stl/css :your-subscription)}
        [:h3 {:class (stl/css :plan-section-title)} (tr "subscription.settings.section-plan")]
-       (case subscription-type
-         "professional"
-         [:> plan-card* {:card-title (tr "subscription.settings.professional")
-                         :benefits [(tr "subscription.settings.professional.storage-benefit"),
-                                    (tr "subscription.settings.professional.autosave-benefit"),
-                                    (tr "subscription.settings.professional.teams-editors-benefit")]}]
+       (if nitrate?
+         ;; TODO add translations for this texts when we have the definitive ones
+         [:> plan-card* {:card-title "Business Nitrate"
+                         :card-title-icon i/character-b
+                         :benefits-title "Loren ipsum",
+                         :benefits ["Loren ipsum",
+                                    "Loren ipsum",
+                                    "Loren ipsum"]
+                         :cta-text-with-icon "Control Center"
+                         :cta-link-with-icon dnt/go-to-nitrate-cc
+                         :cta-text (tr "subscription.settings.manage-your-subscription")
+                         :cta-link dnt/go-to-nitrate-billing}]
+         (case subscription-type
+           "professional"
+           [:> plan-card* {:card-title (tr "subscription.settings.professional")
+                           :benefits [(tr "subscription.settings.professional.storage-benefit"),
+                                      (tr "subscription.settings.professional.autosave-benefit"),
+                                      (tr "subscription.settings.professional.teams-editors-benefit")]}]
 
-         "unlimited"
-         (if subscription-is-trial?
-           [:> plan-card* {:card-title (tr "subscription.settings.unlimited-trial")
-                           :card-title-icon i/character-u
-                           :benefits-title (tr "subscription.settings.benefits.all-professional-benefits"),
-                           :benefits [(tr "subscription.settings.unlimited.storage-benefit")
-                                      (tr "subscription.settings.unlimited.autosave-benefit"),
-                                      (tr "subscription.settings.unlimited.bill")]
-                           :cta-text (tr "subscription.settings.manage-your-subscription")
-                           :cta-link go-to-payments
-                           :cta-text-trial (tr "subscription.settings.add-payment-to-continue")
-                           :cta-link-trial go-to-payments
-                           :editors (-> profile :props :subscription :quantity)}]
+           "unlimited"
+           (if subscription-is-trial?
+             [:> plan-card* {:card-title (tr "subscription.settings.unlimited-trial")
+                             :card-title-icon i/character-u
+                             :benefits-title (tr "subscription.settings.benefits.all-professional-benefits"),
+                             :benefits [(tr "subscription.settings.unlimited.storage-benefit")
+                                        (tr "subscription.settings.unlimited.autosave-benefit"),
+                                        (tr "subscription.settings.unlimited.bill")]
+                             :cta-text (tr "subscription.settings.manage-your-subscription")
+                             :cta-link go-to-payments
+                             :cta-text-trial (tr "subscription.settings.add-payment-to-continue")
+                             :cta-link-trial go-to-payments
+                             :editors (-> profile :props :subscription :quantity)}]
 
-           [:> plan-card* {:card-title (tr "subscription.settings.unlimited")
-                           :card-title-icon i/character-u
-                           :benefits-title (tr "subscription.settings.benefits.all-unlimited-benefits")
-                           :benefits [(tr "subscription.settings.unlimited.storage-benefit"),
-                                      (tr "subscription.settings.unlimited.autosave-benefit"),
-                                      (tr "subscription.settings.unlimited.bill")]
-                           :cta-text (tr "subscription.settings.manage-your-subscription")
-                           :cta-link go-to-payments
-                           :editors (-> profile :props :subscription :quantity)}])
+             [:> plan-card* {:card-title (tr "subscription.settings.unlimited")
+                             :card-title-icon i/character-u
+                             :benefits-title (tr "subscription.settings.benefits.all-unlimited-benefits")
+                             :benefits [(tr "subscription.settings.unlimited.storage-benefit"),
+                                        (tr "subscription.settings.unlimited.autosave-benefit"),
+                                        (tr "subscription.settings.unlimited.bill")]
+                             :cta-text (tr "subscription.settings.manage-your-subscription")
+                             :cta-link go-to-payments
+                             :editors (-> profile :props :subscription :quantity)}])
 
-         "enterprise"
-         (if subscription-is-trial?
-           [:> plan-card* {:card-title (tr "subscription.settings.enterprise-trial")
-                           :card-title-icon i/character-e
-                           :benefits-title (tr "subscription.settings.benefits.all-unlimited-benefits"),
-                           :benefits [(tr "subscription.settings.enterprise.unlimited-storage-benefit"),
-                                      (tr "subscription.settings.enterprise.autosave"),
-                                      (tr "subscription.settings.enterprise.capped-bill")]
-                           :cta-text (tr "subscription.settings.manage-your-subscription")
-                           :cta-link go-to-payments
-                           :cta-text-trial (tr "subscription.settings.add-payment-to-continue")
-                           :cta-link-trial go-to-payments}]
-           [:> plan-card* {:card-title (tr "subscription.settings.enterprise")
-                           :card-title-icon i/character-e
-                           :benefits-title (tr "subscription.settings.benefits.all-unlimited-benefits"),
-                           :benefits [(tr "subscription.settings.enterprise.unlimited-storage-benefit"),
-                                      (tr "subscription.settings.enterprise.autosave"),
-                                      (tr "subscription.settings.enterprise.capped-bill")]
-                           :cta-text (tr "subscription.settings.manage-your-subscription")
-                           :cta-link go-to-payments}]))
+           "enterprise"
+           (if subscription-is-trial?
+             [:> plan-card* {:card-title (tr "subscription.settings.enterprise-trial")
+                             :card-title-icon i/character-e
+                             :benefits-title (tr "subscription.settings.benefits.all-unlimited-benefits"),
+                             :benefits [(tr "subscription.settings.enterprise.unlimited-storage-benefit"),
+                                        (tr "subscription.settings.enterprise.autosave"),
+                                        (tr "subscription.settings.enterprise.capped-bill")]
+                             :cta-text (tr "subscription.settings.manage-your-subscription")
+                             :cta-link go-to-payments
+                             :cta-text-trial (tr "subscription.settings.add-payment-to-continue")
+                             :cta-link-trial go-to-payments}]
+             [:> plan-card* {:card-title (tr "subscription.settings.enterprise")
+                             :card-title-icon i/character-e
+                             :benefits-title (tr "subscription.settings.benefits.all-unlimited-benefits"),
+                             :benefits [(tr "subscription.settings.enterprise.unlimited-storage-benefit"),
+                                        (tr "subscription.settings.enterprise.autosave"),
+                                        (tr "subscription.settings.enterprise.capped-bill")]
+                             :cta-text (tr "subscription.settings.manage-your-subscription")
+                             :cta-link go-to-payments}])))
 
        [:div {:class (stl/css :membership-container)}
-        (when (and subscribed-since (not= subscription-type "professional"))
+        (when (or nitrate?
+                  (and subscribed-since (not= subscription-type "professional")))
           [:div {:class (stl/css :membership)}
            [:> icon* {:class (stl/css :subscription-member)
                       :icon-id "crown"
@@ -582,7 +602,7 @@
                          :show-button-cta (= subscription-type "professional")}])
 
        ;; TODO add translations for this texts when we have the definitive ones
-       (when (and (contains? cf/flags :nitrate) (not (:nitrate-licence profile)))
+       (when (and (contains? cf/flags :nitrate) (not nitrate?))
          [:> plan-card* {:card-title "Business Nitrate"
                          :card-title-icon i/character-n
                          :price-value "$25"

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

@@ -13,8 +13,10 @@
    [app.common.types.components-list :as ctkl]
    [app.common.types.file :as ctf]
    [app.common.types.library :as ctl]
+   [app.common.types.tokens-lib :as ctob]
    [app.common.types.typographies-list :as ctyl]
    [app.common.uuid :as uuid]
+   [app.config :as cf]
    [app.main.data.dashboard :as dd]
    [app.main.data.modal :as modal]
    [app.main.data.notifications :as ntf]
@@ -36,6 +38,7 @@
    [app.main.ui.ds.product.empty-state :refer [empty-state*]]
    [app.main.ui.hooks :as h]
    [app.main.ui.icons :as deprecated-icon]
+   [app.main.ui.workspace.tokens.import-from-library]
    [app.util.color :as uc]
    [app.util.dom :as dom]
    [app.util.i18n :refer [c tr]]
@@ -180,6 +183,12 @@
   [summary]
   (boolean (:is-empty summary)))
 
+(defn- has-tokens?
+  "Check if library has tokens to be imported"
+  [{:keys [data]}]
+  (when-let [tokens-lib (get data :tokens-lib)]
+    (not (ctob/empty-lib? tokens-lib))))
+
 (mf/defc libraries-tab*
   {::mf/props :obj
    ::mf/private true}
@@ -230,14 +239,18 @@
                                                        (keep library-names))))
                (sort-by (comp str/lower :name))))
 
-        linked-libraries-ids (mf/with-memo [linked-libraries]
-                               (into #{} (map :id) linked-libraries))
+        linked-libraries-ids
+        (mf/with-memo [linked-libraries]
+          (into #{} d/xf:map-id linked-libraries))
 
+        importing*
+        (mf/use-state nil)
 
-        importing*       (mf/use-state nil)
-        sample-libraries [{:id "penpot-design-system", :name "Design system example"}
-                          {:id "wireframing-kit", :name "Wireframe library"}
-                          {:id "whiteboarding-kit", :name "Whiteboarding Kit"}]
+        sample-libraries
+        (mf/with-memo []
+          [{:id "penpot-design-system", :name "Design system example"}
+           {:id "wireframing-kit", :name "Wireframe library"}
+           {:id "whiteboarding-kit", :name "Whiteboarding Kit"}])
 
 
         change-search-term
@@ -267,6 +280,17 @@
              (st/emit! (dwl/unlink-file-from-library file-id library-id)
                        (dwl/sync-file file-id library-id)))))
 
+        import-tokens
+        (mf/use-fn
+         (mf/deps file-id)
+         (fn [event]
+           (let [library-id (some-> (dom/get-current-target event)
+                                    (dom/get-data "library-id")
+                                    (uuid/parse))]
+             (st/emit! (modal/show
+                        :tokens/import-from-library {:file-id file-id
+                                                     :library-id library-id})))))
+
         on-delete-accept
         (mf/use-fn
          (mf/deps file-id)
@@ -332,8 +356,12 @@
                    :on-click publish}])]
 
        (for [{:keys [id name data connected-to connected-to-names] :as library} linked-libraries]
-         (let [disabled? (some #(contains? linked-libraries-ids %) connected-to)]
-           [:div {:class (stl/css :section-list-item)
+         (let [disabled?   (some #(contains? linked-libraries-ids %) connected-to)
+               has-tokens? (and (has-tokens? library)
+                                (contains? cf/flags :token-import-from-library))]
+           [:div {:class (if has-tokens?
+                           (stl/css :section-list-item-double-icon)
+                           (stl/css :section-list-item))
                   :key (dm/str id)
                   :data-testid "library-item"}
             [:div {:class (stl/css :item-content)}
@@ -348,6 +376,15 @@
                     [:span {:class (stl/css :connected-to-values)} (str/join ", " connected-to-names)]
                     [:span ")"]])])]]
 
+            (when ^boolean has-tokens?
+              [:> icon-button*
+               {:type "button"
+                :aria-label (tr "workspace.tokens.import-tokens")
+                :icon i/import-export
+                :data-library-id (dm/str id)
+                :variant "secondary"
+                :on-click import-tokens}])
+
             [:> icon-button* {:type "button"
                               :aria-label (tr "workspace.libraries.unlink-library-btn")
                               :icon i/detach

frontend/src/app/main/ui/workspace/libraries.scss

@@ -116,6 +116,11 @@
   border-radius: $br-8;
 }
 
+.section-list-item-double-icon {
+  @extend .section-list-item;
+  grid-template-columns: 1fr auto auto;
+}
+
 .item-content {
   height: fit-content;
 }

frontend/src/app/main/ui/workspace/sidebar/assets/colors.cljs

@@ -93,6 +93,12 @@
                          (dwl/sync-file file-id file-id :colors color-id)
                          (dwu/commit-undo-transaction undo-id))))))
 
+        duplicate-color
+        (mf/use-fn
+         (mf/deps file-id color-id)
+         (fn []
+           (st/emit! (dwl/duplicate-color file-id color-id))))
+
         rename-color-clicked
         (mf/use-fn
          (mf/deps read-only? local?)
@@ -247,7 +253,10 @@
                      {:name    (tr "workspace.assets.edit")
                       :id      "assets-edit-color"
                       :handler edit-color-clicked})
-
+                   (when-not (or multi-colors? multi-assets?)
+                     {:name    (tr "workspace.assets.duplicate")
+                      :id      "assets-duplicate-color"
+                      :handler duplicate-color})
                    {:name    (tr "workspace.assets.delete")
                     :id      "assets-delete-color"
                     :handler delete-color}

frontend/src/app/main/ui/workspace/sidebar/assets/typographies.cljs

@@ -377,6 +377,12 @@
                          (dwl/sync-file file-id file-id :typographies (:id @state))
                          (dwu/commit-undo-transaction undo-id))))))
 
+        handle-duplicate-typography
+        (mf/use-fn
+         (mf/deps file-id @state)
+         (fn []
+           (st/emit! (dwl/duplicate-typography file-id (:id @state)))))
+
         editing-id (:edit-typography local-data)
 
         renaming-id (:rename-typography local-data)
@@ -440,6 +446,11 @@
                         :id      "assets-edit-typography"
                         :handler handle-edit-typography-clicked})
 
+                     (when-not (or multi-typographies? multi-assets?)
+                       {:name    (tr "workspace.assets.duplicate")
+                        :id      "assets-duplicate-typography"
+                        :handler handle-duplicate-typography})
+
                      {:name    (tr "workspace.assets.delete")
                       :id      "assets-delete-typography"
                       :handler handle-delete-typography}

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

@@ -92,6 +92,19 @@
 (def ^:private xf:map-type (map :type))
 (def ^:private xf:mapcat-type-to-options (mapcat type->options))
 
+(defn fixed-decimal-value
+  "Fixes the amount of decimals that are kept"
+  ([value]
+   (fixed-decimal-value value 2))
+
+  ([value decimals]
+   (cond
+     (string? value)
+     (fixed-decimal-value (parse-double value) decimals)
+
+     (number? value)
+     (parse-double (.toFixed value decimals)))))
+
 (mf/defc measures-menu*
   [{:keys [ids values applied-tokens type shapes]}]
   (let [token-numeric-inputs
@@ -300,7 +313,7 @@
          (mf/deps ids)
          (fn [value]
            (if (or (string? value) (number? value))
-             (do
+             (let [value (fixed-decimal-value value)]
                (st/emit! (udw/trigger-bounding-box-cloaking ids))
                (st/emit! (udw/increase-rotation ids value)))
              (st/emit! (udw/trigger-bounding-box-cloaking ids)

frontend/src/app/main/ui/workspace/tokens/import_from_library.cljs

@@ -0,0 +1,92 @@
+;; This Source Code Form is subject to the terms of the Mozilla Public
+;; License, v. 2.0. If a copy of the MPL was not distributed with this
+;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
+;;
+;; Copyright (c) KALEIDOS INC
+
+(ns app.main.ui.workspace.tokens.import-from-library
+  (:require-macros [app.main.style :as stl])
+  (:require
+   [app.common.data.macros :as dm]
+   [app.main.data.modal :as modal]
+   [app.main.data.workspace.tokens.library-edit :as dwtl]
+   [app.main.store :as st]
+   [app.main.ui.ds.buttons.button :refer [button*]]
+   [app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
+   [app.main.ui.ds.foundations.assets.icon :as i]
+   [app.main.ui.ds.foundations.typography :as t]
+   [app.main.ui.ds.foundations.typography.heading :refer [heading*]]
+   [app.main.ui.ds.foundations.typography.text :refer [text*]]
+   [app.main.ui.ds.notifications.context-notification :refer [context-notification*]]
+   [app.util.i18n :refer [tr]]
+   [okulary.core :as l]
+   [rumext.v2 :as mf]))
+
+
+(mf/defc import-modal-library*
+  {::mf/register modal/components
+   ::mf/register-as :tokens/import-from-library}
+  [all-props]
+  (let [{:keys [file-id library-id]}
+        (js->clj all-props :keywordize-keys true)
+
+        library-file-ref (mf/with-memo [library-id]
+                           (l/derived (fn [state]
+                                        (dm/get-in state [:files library-id :data]))
+                                      st/state))
+        library-data (mf/deref library-file-ref)
+
+        show-libraries-dialog
+        (mf/use-fn
+         (mf/deps file-id)
+         (fn []
+           (modal/hide!)
+           (modal/show! :libraries-dialog {:file-id file-id})))
+
+        cancel
+        (mf/use-fn
+         (fn []
+           (show-libraries-dialog)))
+
+        import
+        (mf/use-fn
+         (mf/deps file-id library-id library-data)
+         (fn []
+           (let [tokens-lib (:tokens-lib library-data)]
+             (st/emit! (dwtl/import-tokens-lib tokens-lib)))
+           (show-libraries-dialog)))]
+
+    [:div {:class (stl/css :modal-overlay)}
+     [:div {:class (stl/css :modal-dialog)}
+      [:> icon-button* {:class (stl/css :close-btn)
+                        :on-click cancel
+                        :aria-label (tr "labels.close")
+                        :variant "ghost"
+                        :icon i/close}]
+
+      [:div {:class (stl/css :modal-header)}
+       [:> heading* {:level 2
+                     :id "modal-title"
+                     :typography "headline-large"
+                     :class (stl/css :modal-title)}
+        (tr "modals.import-library-tokens.title")]]
+
+      [:div {:class (stl/css :modal-content)}
+       [:> text* {:as "p" :typography t/body-medium} (tr "modals.import-library-tokens.description")]]
+
+      [:> context-notification* {:type :context
+                                 :appearance "neutral"
+                                 :level "default"
+                                 :is-html true}
+       (tr "workspace.tokens.import-warning")]
+
+      [:div {:class (stl/css :modal-footer)}
+       [:div {:class (stl/css :action-buttons)}
+        [:> button* {:on-click cancel
+                     :type "button"
+                     :variant "secondary"}
+         (tr "labels.cancel")]
+        [:> button* {:on-click import
+                     :type "button"
+                     :variant "primary"}
+         (tr "modals.import-library-tokens.import")]]]]]))

frontend/src/app/main/ui/workspace/tokens/import_from_library.scss

@@ -0,0 +1,70 @@
+// This Source Code Form is subject to the terms of the Mozilla Public
+// License, v. 2.0. If a copy of the MPL was not distributed with this
+// file, You can obtain one at http://mozilla.org/MPL/2.0/.
+//
+// Copyright (c) KALEIDOS INC
+
+@use "refactor/common-refactor.scss" as deprecated;
+
+@use "ds/typography.scss" as t;
+@use "ds/_borders.scss" as *;
+@use "ds/_sizes.scss" as *;
+
+.close-btn {
+  position: absolute;
+  inset-block-start: var(--sp-s);
+  inset-inline-end: var(--sp-s);
+}
+
+.modal-overlay {
+  --modal-title-foreground-color: var(--color-foreground-primary);
+  --modal-text-foreground-color: var(--color-foreground-secondary);
+
+  @extend .modal-overlay-base;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: fixed;
+  inset-inline-start: 0;
+  inset-block-start: 0;
+  block-size: 100%;
+  inline-size: 100%;
+  background-color: var(--overlay-color);
+}
+
+.modal-dialog {
+  @extend .modal-container-base;
+  inline-size: 100%;
+  max-inline-size: 32rem;
+  max-block-size: unset;
+  user-select: none;
+  position: relative;
+}
+
+.modal-header {
+  margin-block-end: var(--sp-xxl);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.modal-title {
+  @include t.use-typography("headline-medium");
+  color: var(--modal-title-foreground-color);
+  word-break: break-word;
+}
+
+.modal-content {
+  @include t.use-typography("body-large");
+  color: var(--modal-text-foreground-color);
+}
+
+.modal-footer {
+  margin-block-start: var(--sp-xxl);
+  gap: var(--sp-s);
+}
+
+.action-buttons {
+  @extend .modal-action-btns;
+  gap: var(--sp-s);
+}

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

@@ -55,7 +55,7 @@
 
 (defn top?
   [cur cand]
-  (let [closey? (mth/close? (:y cand) (:y cur))]
+  (let [closey? (mth/close? (:y cand) (:y cur) 0.01)]
     (cond
       (and closey? (< (:x cand) (:x cur))) cand
       closey?                              cur
@@ -64,13 +64,19 @@
 
 (defn right?
   [cur cand]
-  (let [closex? (mth/close? (:x cand) (:x cur))]
+  (let [closex? (mth/close? (:x cand) (:x cur) 0.01)]
     (cond
       (and closex? (< (:y cand) (:y cur))) cand
       closex?                              cur
       (> (:x cand) (:x cur))               cand
       :else                                cur)))
 
+(defn title-transform-use-width?
+  [{:keys [rotation] :as shape}]
+  (let [side       (mth/ceil (/ (- rotation 45) 90))
+        use-width? (even? side)]
+    use-width?))
+
 (defn title-transform
   [{:keys [points] :as shape} zoom grid-edition?]
   (let [leftmost  (->> points (reduce left?))

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

@@ -129,13 +129,15 @@
          (fn [_]
            (on-frame-leave (:id frame))))
 
-        main-instance? (ctk/main-instance? frame)
-        is-variant?    (:is-variant-container frame)
+        main-instance?   (ctk/main-instance? frame)
+        is-variant?      (:is-variant-container frame)
 
-        text-width (* (:width frame) zoom)
-        show-icon? (and (or (:use-for-thumbnail frame) is-grid-edition main-instance? is-variant?)
-                        (not (<= text-width 15)))
-        text-pos-x (if show-icon? 15 0)
+        use-width?        (vwu/title-transform-use-width? frame)
+
+        text-width       (* (if use-width? (:width frame) (:height frame)) zoom)
+        show-icon?       (and (or (:use-for-thumbnail frame) is-grid-edition main-instance? is-variant?)
+                              (not (<= text-width 15)))
+        text-pos-x       (if show-icon? 15 0)
 
         edition*         (mf/use-state false)
         edition?         (deref edition*)
@@ -178,7 +180,6 @@
            (when (kbd/enter? event) (accept-edit))
            (when (kbd/esc? event) (cancel-edit))))]
 
-
     (when (not (:hidden frame))
       [:g.frame-title {:id (dm/str "frame-title-" (:id frame))
                        :data-edit-grid is-grid-edition

frontend/src/app/util/i18n.cljs

@@ -31,6 +31,7 @@
    {:label "Dutch (community)" :value "nl"}
    {:label "Euskera (community)" :value "eu"}
    {:label "Français (community)" :value "fr"}
+   {:label "Français - Canada (community)" :value "fr_CA"}
    {:label "Gallego (Community)" :value "gl"}
    {:label "Hausa (Community)" :value "ha"}
    {:label "Hrvatski (Community)" :value "hr"}

frontend/translations/en.po

@@ -1153,6 +1153,20 @@ msgstr "Type to search results"
 msgid "dashboard.unpublish-shared"
 msgstr "Unpublish Library"
 
+#:src/app/main/ui/workspace/tokens/import_from_library.cljs
+msgid "modals.import-library-tokens.title"
+msgstr "Import tokens from library?"
+
+#:src/app/main/ui/workspace/tokens/import_from_library.cljs
+msgid "modals.import-library-tokens.description"
+msgstr ""
+"The library has tokens and themes which "
+"are likely used by its components."
+
+#:src/app/main/ui/workspace/tokens/import_from_library.cljs
+msgid "modals.import-library-tokens.import"
+msgstr "Import tokens"
+
 #: src/app/main/ui/settings/options.cljs:74
 msgid "dashboard.update-settings"
 msgstr "Update settings"