Merge pull request #1074 from penpot/import/drag-drop

Import/drag drop

common/src/app/common/file_builder.cljc

@@ -319,7 +319,9 @@
         create-child
         (fn [file child]
           (-> file
-              (create-svg-raw (assoc data :content child))
+              (create-svg-raw (assoc data
+                                     :id (uuid/next)
+                                     :content child))
               (close-svg-raw)))]
 
     ;; First :content is the the shape attribute, the other content is the

frontend/resources/styles/main/partials/dashboard-grid.scss

@@ -6,6 +6,7 @@
 
 .dashboard-grid {
   font-size: $fs14;
+  height: 100%;
 
   .grid-row {
     display: flex;

frontend/resources/styles/main/partials/modal.scss

@@ -215,6 +215,7 @@
   background-color: $color-white;
   border: 1px solid $color-gray-20;
   width: 30rem;
+  min-height: 14rem;
 
   p {
     font-size: $fs14;
@@ -276,10 +277,6 @@
   .modal-content {
     padding: 1rem;
   }
-}
-
-.import-dialog {
-  min-height: 215px;
 
   svg {
     max-width: 18px;
@@ -451,8 +448,6 @@
 }
 
 .export-dialog {
-  min-height: 24rem;
-
   .export-option {
     border-radius: 4px;
     border: 1px solid $color-gray-10;

frontend/src/app/main/exports.cljs

@@ -86,9 +86,9 @@
     (mf/fnc svg-raw-wrapper
       [{:keys [shape frame] :as props}]
       (let [childs (mapv #(get objects %) (:shapes shape))]
-        (if (and (contains? shape :svg-attrs)
+        (if (and (map? (:content shape))
-                 (map? (:content shape))
+                 (or (= :svg (get-in shape [:content :tag]))
-                 (not= :svg (get-in shape [:content :tag])))
+                     (contains? shape :svg-attrs)))
           [:> shape-container {:shape shape}
            [:& svg-raw-shape {:frame frame
                               :shape shape

frontend/src/app/main/ui/confirm.cljs

@@ -9,7 +9,6 @@
    [app.main.data.modal :as modal]
    [app.main.store :as st]
    [app.main.ui.icons :as i]
-   [app.util.data :refer [classnames]]
    [app.util.dom :as dom]
    [app.util.i18n :as i18n :refer [tr t]]
    [app.util.keyboard :as k]
@@ -86,9 +85,9 @@
             :on-click cancel-fn}])
 
         [:input.accept-button
-         {:class (classnames :danger (= accept-style :danger)
+         {:class (dom/classnames
-                             :primary (= accept-style :primary))
+                  :danger (= accept-style :danger)
+                  :primary (= accept-style :primary))
           :type "button"
           :value accept-label
           :on-click accept-fn}]]]]]))
-

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

@@ -18,12 +18,61 @@
 
 (def ^:const options [:all :merge :detach])
 
+(mf/defc export-entry
+  [{:keys [file]}]
+
+  [:div.file-entry
+   {:class (dom/classnames
+            :loading  (:loading? file)
+            :success  (:export-success? file)
+            :error    (:export-error? file))}
+   [:div.file-name
+    [:div.file-icon
+     (cond (:export-success? file) i/tick
+           (:export-error? file)   i/close
+           (:loading? file)        i/loader-pencil)]
+
+    [:div.file-name-label (:name file)]]])
+
+(defn mark-file-error [files file-id]
+  (->> files
+       (mapv #(cond-> %
+                (= file-id (:id %))
+                (assoc :export-error? true
+                       :loading? false)))))
+
+(defn mark-file-success [files file-id]
+  (->> files
+       (mapv #(cond-> %
+                (= file-id (:id %))
+                (assoc :export-success? true
+                       :loading? false)))))
+
 (mf/defc export-dialog
   {::mf/register modal/components
    ::mf/register-as :export}
-  [{:keys [team-id files]}]
+  [{:keys [team-id files has-libraries?]}]
-  (let [selected-option (mf/use-state :all)
+  (let [state (mf/use-state {:status :prepare
+                             :files  (->> files (mapv #(assoc % :loading? true)))})
+        selected-option (mf/use-state :all)
 
+        start-export
+        (fn []
+          (swap! state assoc :status :exporting)
+          (->> (uw/ask-many!
+                {:cmd :export-file
+                 :team-id team-id
+                 :export-type @selected-option
+                 :files (->> files (mapv :id))})
+               (rx/delay-emit 1000)
+               (rx/subs
+                (fn [msg]
+                  (when  (= :error (:type msg))
+                    (swap! state update :files mark-file-error (:file-id msg)))
+
+                  (when  (= :finish (:type msg))
+                    (swap! state update :files mark-file-success (:file-id msg))
+                    (dom/trigger-download-uri (:filename msg) (:mtype msg) (:uri msg)))))))
         cancel-fn
         (mf/use-callback
          (fn [event]
@@ -35,24 +84,19 @@
          (mf/deps @selected-option)
          (fn [event]
            (dom/prevent-default event)
-           
+           (start-export)))
-           (->> (uw/ask-many!
-                 {:cmd :export-file
-                  :team-id team-id
-                  :export-type @selected-option
-                  :files files})
-                (rx/subs
-                 (fn [msg]
-                   (when  (= :finish (:type msg))
-                     (dom/trigger-download-uri (:filename msg) (:mtype msg) (:uri msg))))))
-
-           (st/emit! (modal/hide))))
 
         on-change-handler
         (mf/use-callback
          (fn [_ type]
            (reset! selected-option type)))]
 
+    (mf/use-effect
+     (fn []
+       (when-not has-libraries?
+         ;; Start download automaticaly
+         (start-export))))
+
     [:div.modal-overlay
      [:div.modal-container.export-dialog
       [:div.modal-header
@@ -62,31 +106,49 @@
        [:div.modal-close-button
         {:on-click cancel-fn} i/close]]
 
-      [:div.modal-content
+      (cond
-       [:p.explain (tr "dashboard.export.explain")]
+        (= (:status @state) :prepare)
-       [:p.detail (tr "dashboard.export.detail")]
+        [:*
+         [:div.modal-content
+          [:p.explain (tr "dashboard.export.explain")]
+          [:p.detail (tr "dashboard.export.detail")]
 
-       (for [type [:all :merge :detach]]
+          (for [type [:all :merge :detach]]
-         (let [selected? (= @selected-option type)]
+            (let [selected? (= @selected-option type)]
-           [:div.export-option {:class (when selected? "selected")}
+              [:div.export-option {:class (when selected? "selected")}
-            [:label.option-container
+               [:label.option-container
-             [:h3 (tr (str "dashboard.export.options." (d/name type) ".title"))] 
+                [:h3 (tr (str "dashboard.export.options." (d/name type) ".title"))] 
-             [:p  (tr (str "dashboard.export.options." (d/name type) ".message"))]
+                [:p  (tr (str "dashboard.export.options." (d/name type) ".message"))]
-             [:input {:type "radio"
+                [:input {:type "radio"
-                      :checked selected?
+                         :checked selected?
-                      :on-change #(on-change-handler % type)
+                         :on-change #(on-change-handler % type)
-                      :name "export-option"}]
+                         :name "export-option"}]
-             [:span {:class "option-radio-check"}]]]))]
+                [:span {:class "option-radio-check"}]]]))]
 
-      [:div.modal-footer
+         [:div.modal-footer
-       [:div.action-buttons
+          [:div.action-buttons
-        [:input.cancel-button
+           [:input.cancel-button
-         {:type "button"
+            {:type "button"
-          :value (tr "labels.cancel")
+             :value (tr "labels.cancel")
-          :on-click cancel-fn}]
+             :on-click cancel-fn}]
 
-        [:input.accept-button
+           [:input.accept-button
-         {:class "primary"
+            {:class "primary"
-          :type "button"
+             :type "button"
-          :value (tr "labels.export")
+             :value (tr "labels.continue")
-          :on-click accept-fn}]]]]]))
+             :on-click accept-fn}]]]]
+
+        (= (:status @state) :exporting)
+        [:*
+         [:div.modal-content
+          (for [file (:files @state)]
+            [:& export-entry {:file file}])]
+
+         [:div.modal-footer
+          [:div.action-buttons
+           [:input.accept-button
+            {:class "primary"
+             :type "button"
+             :value (tr "labels.close")
+             :disabled (->> @state :files (some :loading?))
+             :on-click cancel-fn}]]]])]]))

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

@@ -6,6 +6,7 @@
 
 (ns app.main.ui.dashboard.file-menu
   (:require
+   [app.common.data :as d]
    [app.main.data.dashboard :as dd]
    [app.main.data.messages :as dm]
    [app.main.data.modal :as modal]
@@ -155,12 +156,23 @@
                       :on-accept del-shared})))
 
         on-export-files
-        (fn [_]
+        (mf/use-callback
-          (st/emit!
+         (mf/deps files current-team-id)
-           (modal/show
+         (fn [_]
-            {:type :export
+           (->> (rx/from files)
-             :team-id current-team-id
+                (rx/flat-map
-             :files (->> files (mapv :id))})))]
+                 (fn [file]
+                   (->> (rp/query :file-libraries {:file-id (:id file)})
+                        (rx/map #(assoc file :has-libraries? (d/not-empty? %))))))
+                (rx/reduce conj [])
+                (rx/subs
+                 (fn [files]
+                   (st/emit!
+                    (modal/show
+                     {:type :export
+                      :team-id current-team-id
+                      :has-libraries? (->> files (some :has-libraries?))
+                      :files files})))))))]
 
     (mf/use-effect
      (fn []

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

@@ -44,7 +44,14 @@
          (mf/deps project)
          (fn [event]
            (dom/prevent-default event)
-           (st/emit! (dd/create-file {:project-id (:id project)}))))]
+           (st/emit! (dd/create-file {:project-id (:id project)}))))
+
+        on-import
+        (mf/use-callback
+         (mf/deps (:id project))
+         (fn []
+           (st/emit! (dd/fetch-files {:project-id (:id project)})
+                     (dd/clear-selected-files))))]
 
 
     [:header.dashboard-header
@@ -65,7 +72,8 @@
                             :left (- (:x (:menu-pos @local)) 180)
                             :top (:y (:menu-pos @local))
                             :on-edit on-edit
-                            :on-menu-close on-menu-close}]]))
+                            :on-menu-close on-menu-close
+                            :on-import on-import}]]))
      [:div.dashboard-header-actions
       [:a.btn-secondary.btn-small {:on-click on-create-clicked}
        (tr "dashboard.new-file")]
@@ -102,6 +110,6 @@
     [:*
      [:& header {:team team :project project}]
      [:section.dashboard-container
-      [:& grid {:id (:id project)
+      [:& grid {:project-id (:id project)
                 :files files}]]]))
 

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

@@ -13,6 +13,7 @@
    [app.main.refs :as refs]
    [app.main.store :as st]
    [app.main.ui.dashboard.file-menu :refer [file-menu]]
+   [app.main.ui.dashboard.import :refer [use-import-file]]
    [app.main.ui.dashboard.inline-edition :refer [inline-edition]]
    [app.main.ui.icons :as i]
    [app.main.worker :as wrk]
@@ -210,22 +211,68 @@
    [:div.text (tr "dashboard.loading-files")]])
 
 (mf/defc grid
-  [{:keys [files] :as props}]
+  [{:keys [files project-id] :as props}]
-  [:section.dashboard-grid
+  (let [dragging? (mf/use-state false)
-   (cond
-     (nil? files)
-     [:& loading-placeholder]
 
-     (seq files)
+        on-finish-import
-     [:div.grid-row
+        (mf/use-callback
-      (for [item files]
+         (fn []
-        [:& grid-item
+           (st/emit! (dd/fetch-files {:project-id project-id})
-         {:file item
+                     (dd/clear-selected-files))))
-          :key (:id item)
-          :navigate? true}])]
 
-     :else
+        import-files (use-import-file project-id on-finish-import)
-     [:& empty-placeholder])])
+
+        on-drag-enter
+        (mf/use-callback
+         (fn [e]
+           (when (or (dnd/has-type? e "Files")
+                     (dnd/has-type? e "application/x-moz-file"))
+             (dom/prevent-default e)
+             (reset! dragging? true))))
+
+        on-drag-over
+        (mf/use-callback
+         (fn [e]
+           (when (or (dnd/has-type? e "Files")
+                     (dnd/has-type? e "application/x-moz-file"))
+             (dom/prevent-default e))))
+
+        on-drag-leave
+        (mf/use-callback
+         (fn [e]
+           (when-not (dnd/from-child? e)
+             (reset! dragging? false))))
+
+
+        on-drop
+        (mf/use-callback
+         (fn [e]
+           (when (or (dnd/has-type? e "Files")
+                     (dnd/has-type? e "application/x-moz-file"))
+             (dom/prevent-default e)
+             (reset! dragging? false)
+             (import-files (.-files (.-dataTransfer e))))))]
+
+    [:section.dashboard-grid {:on-drag-enter on-drag-enter
+                              :on-drag-over on-drag-over
+                              :on-drag-leave on-drag-leave
+                              :on-drop on-drop}
+     (cond
+       (nil? files)
+       [:& loading-placeholder]
+
+       (seq files)
+       [:div.grid-row
+        (when @dragging?
+          [:div.grid-item])
+        (for [item files]
+          [:& grid-item
+           {:file item
+            :key (:id item)
+            :navigate? true}])]
+
+       :else
+       [:& empty-placeholder])]))
 
 (mf/defc line-grid-row
   [{:keys [files selected-files on-load-more dragging?] :as props}]
@@ -285,10 +332,17 @@
 (mf/defc line-grid
   [{:keys [project-id team-id files on-load-more] :as props}]
   (let [dragging?        (mf/use-state false)
-
         selected-files   (mf/deref refs/dashboard-selected-files)
         selected-project (mf/deref refs/dashboard-selected-project)
 
+        on-finish-import
+        (mf/use-callback
+         (fn []
+           (st/emit! (dd/fetch-recent-files)
+                     (dd/clear-selected-files))))
+
+        import-files (use-import-file project-id on-finish-import)
+
         on-drag-enter
         (mf/use-callback
           (mf/deps selected-project)
@@ -298,13 +352,20 @@
               (when-not (or (dnd/from-child? e)
                             (dnd/broken-event? e))
                 (when (not= selected-project project-id)
-                  (reset! dragging? true))))))
+                  (reset! dragging? true))))
+
+            (when (or (dnd/has-type? e "Files")
+                      (dnd/has-type? e "application/x-moz-file"))
+              (dom/prevent-default e)
+              (reset! dragging? true))))
 
         on-drag-over
         (mf/use-callback
-          (fn [e]
+         (fn [e]
-            (when (dnd/has-type? e "penpot/files")
+           (when (or (dnd/has-type? e "penpot/files")
-              (dom/prevent-default e))))
+                     (dnd/has-type? e "Files")
+                     (dnd/has-type? e "application/x-moz-file"))
+             (dom/prevent-default e))))
 
         on-drag-leave
         (mf/use-callback
@@ -321,13 +382,20 @@
         on-drop
         (mf/use-callback
           (mf/deps files selected-files)
-          (fn [_]
+          (fn [e]
-            (reset! dragging? false)
+            (when (or (dnd/has-type? e "Files")
-            (when (not= selected-project project-id)
+                      (dnd/has-type? e "application/x-moz-file"))
-              (let [data  {:ids (into #{} (keys selected-files))
+              (dom/prevent-default e)
-                           :project-id project-id}
+              (reset! dragging? false)
-                    mdata {:on-success on-drop-success}]
+              (import-files (.-files (.-dataTransfer e))))
-                (st/emit! (dd/move-files (with-meta data mdata)))))))]
+
+            (when (dnd/has-type? e "penpot/files")
+              (reset! dragging? false)
+              (when (not= selected-project project-id)
+                (let [data  {:ids (into #{} (keys selected-files))
+                             :project-id project-id}
+                      mdata {:on-success on-drop-success}]
+                  (st/emit! (dd/move-files (with-meta data mdata))))))))]
 
     [:section.dashboard-grid {:on-drag-enter on-drag-enter
                               :on-drag-over on-drag-over

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

@@ -12,7 +12,6 @@
    [app.main.ui.components.file-uploader :refer [file-uploader]]
    [app.main.ui.icons :as i]
    [app.main.worker :as uw]
-   [app.util.data :refer [classnames]]
    [app.util.dom :as dom]
    [app.util.i18n :as i18n :refer [tr]]
    [app.util.keyboard :as kbd]
@@ -144,10 +143,11 @@
            (swap! state update :files remove-file (:file-id file))))]
 
     [:div.file-entry
-     {:class (classnames :loading  loading?
+     {:class (dom/classnames
-                         :success  load-success?
+              :loading  loading?
-                         :error    (or import-error? analyze-error?)
+              :success  load-success?
-                         :editable (and ready? (not editing?)))}
+              :error    (or import-error? analyze-error?)
+              :editable (and ready? (not editing?)))}
 
      [:div.file-name
       [:div.file-icon

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

@@ -20,7 +20,7 @@
    [rumext.alpha :as mf]))
 
 (mf/defc project-menu
-  [{:keys [project show? on-edit on-menu-close top left] :as props}]
+  [{:keys [project show? on-edit on-menu-close top left on-import] :as props}]
   (assert (some? project) "missing `project` prop")
   (assert (boolean? show?) "missing `show?` prop")
   (assert (fn? on-edit) "missing `on-edit` prop")
@@ -84,8 +84,7 @@
         on-finish-import
         (mf/use-callback
          (fn []
-           (st/emit! (dd/fetch-recent-files)
+           (when (some? on-import) (on-import))))]
-                     (dd/clear-selected-files))))]
 
     [:*
      [:& udi/import-form {:ref file-input
@@ -106,7 +105,8 @@
                    [(tr "dashboard.move-to") nil
                     (for [team teams]
                       [(:name team) (on-move (:id team))])])
-                 [(tr "dashboard.import") on-import-files]
+                 (when (some? on-import)
+                   [(tr "dashboard.import") on-import-files])
                  [:separator]
                  [(tr "labels.delete") on-delete]]}]]))
 

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

@@ -93,7 +93,13 @@
          (fn []
            (let [mdata  {:on-success on-file-created}
                  params {:project-id (:id project)}]
-             (st/emit! (dd/create-file (with-meta params mdata))))))]
+             (st/emit! (dd/create-file (with-meta params mdata))))))
+
+        on-import
+        (mf/use-callback
+         (fn []
+           (st/emit! (dd/fetch-recent-files)
+                     (dd/clear-selected-files))))]
 
     [:div.dashboard-project-row {:class (when first? "first")}
      [:div.project
@@ -111,7 +117,8 @@
                         :left (:x (:menu-pos @local))
                         :top (:y (:menu-pos @local))
                         :on-edit on-edit-open
-                        :on-menu-close on-menu-close}]
+                        :on-menu-close on-menu-close
+                        :on-import on-import}]
 
       [:span.info (str file-count " files")]
       (when (> file-count 0)

frontend/src/app/main/ui/viewer/thumbnails.cljs

@@ -12,7 +12,7 @@
    [app.main.store :as st]
    [app.main.ui.components.dropdown :refer [dropdown']]
    [app.main.ui.icons :as i]
-   [app.util.data :refer [classnames]]
+   [app.util.dom :as dom]
    [app.util.i18n :as i18n :refer [tr]]
    [goog.object :as gobj]
    [rumext.alpha :as mf]))
@@ -75,7 +75,7 @@
   [{:keys [selected? frame on-click index objects] :as props}]
   [:div.thumbnail-item {:on-click #(on-click % index)}
    [:div.thumbnail-preview
-    {:class (classnames :selected selected?)}
+    {:class (dom/classnames :selected selected?)}
     [:& exports/frame-svg {:frame frame :objects objects}]]
    [:div.thumbnail-info
     [:span.name {:title (:name frame)} (:name frame)]]])
@@ -104,7 +104,7 @@
                    :container container
                    :show true}
      [:section.viewer-thumbnails
-      {:class (classnames :expanded @expanded?)
+      {:class (dom/classnames :expanded @expanded?)
        :ref container
        :on-mouse-leave on-mouse-leave}
 

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

@@ -6,12 +6,14 @@
 
 (ns app.main.ui.workspace.header
   (:require
+   [app.common.data :as d]
    [app.common.math :as mth]
    [app.config :as cfg]
    [app.main.data.modal :as modal]
    [app.main.data.workspace :as dw]
    [app.main.data.workspace.shortcuts :as sc]
    [app.main.refs :as refs]
+   [app.main.repo :as rp]
    [app.main.store :as st]
    [app.main.ui.components.dropdown :refer [dropdown]]
    [app.main.ui.icons :as i]
@@ -20,6 +22,7 @@
    [app.util.i18n :as i18n :refer [tr]]
    [app.util.keyboard :as kbd]
    [app.util.router :as rt]
+   [beicon.core :as rx]
    [okulary.core :as l]
    [rumext.alpha :as mf]))
 
@@ -135,12 +138,23 @@
                              (reset! editing? true))
 
         on-export-files
-        (fn [_]
+        (mf/use-callback
-          (st/emit!
+         (mf/deps file team-id)
-           (modal/show
+         (fn [_]
-            {:type :export
+           (->> (rx/of file)
-             :team-id team-id
+                (rx/flat-map
-             :files [(:id file)]})))]
+                 (fn [file]
+                   (->> (rp/query :file-libraries {:file-id (:id file)})
+                        (rx/map #(assoc file :has-libraries? (d/not-empty? %))))))
+                (rx/reduce conj [])
+                (rx/subs
+                 (fn [files]
+                   (st/emit!
+                    (modal/show
+                     {:type :export
+                      :team-id team-id
+                      :files files})))))))]
+
     (mf/use-effect
      (mf/deps @editing?)
      #(when @editing?

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

@@ -13,7 +13,7 @@
    [app.main.refs :as refs]
    [app.main.store :as st]
    [app.main.ui.icons :as i]
-   [app.util.data :refer [classnames matches-search]]
+   [app.util.data :refer [matches-search]]
    [app.util.dom :as dom]
    [app.util.i18n :as i18n :refer [t tr]]
    [cuerdas.core :as str]
@@ -170,11 +170,11 @@
       [:div.modal-content
        [:div.libraries-header
         [:div.header-item
-         {:class (classnames :active (= @selected-tab :libraries))
+         {:class (dom/classnames :active (= @selected-tab :libraries))
           :on-click #(change-tab :libraries)}
          (t locale "workspace.libraries.libraries")]
         [:div.header-item
-         {:class (classnames :active (= @selected-tab :updates))
+         {:class (dom/classnames :active (= @selected-tab :updates))
           :on-click #(change-tab :updates)}
          (t locale "workspace.libraries.updates")]]
        [:div.libraries-content

frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs

@@ -18,7 +18,6 @@
    [app.main.ui.hooks :as h]
    [app.main.ui.icons :as i]
    [app.util.color :as uc]
-   [app.util.data :refer [classnames]]
    [app.util.dom :as dom]
    [app.util.i18n :as i18n :refer [tr]]
    [rumext.alpha :as mf]))
@@ -162,7 +161,7 @@
         (when (and (not disable-opacity)
                    (not (:gradient color)))
           [:div.input-element
-           {:class (classnames :percentail (not= (:opacity color) :multiple))}
+           {:class (dom/classnames :percentail (not= (:opacity color) :multiple))}
            [:> numeric-input {:value (-> color :opacity opacity->string)
                               :placeholder (tr "settings.multiple")
                               :on-click select-all

frontend/src/app/util/data.cljs

@@ -153,34 +153,6 @@
 ;; Other
 ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
 
-(defn classnames
-  [& params]
-  {:pre [(even? (count params))]}
-  (str/join " " (reduce (fn [acc [k v]]
-                          (if (and k (true? v))
-                            (conj acc (name k))
-                            acc))
-                        []
-                        (partition 2 params))))
-
-;; (defn normalize-attrs
-;;   [m]
-;;   (letfn [(transform [[k v]]
-;;             (cond
-;;               (or (= k :class) (= k :class-name))
-;;               ["className" v]
-
-;;               (or (keyword? k) (string? k))
-;;               [(str/camel (name k)) v]
-
-;;               :else
-;;               [k v]))
-;;           (walker [x]
-;;             (if (map? x)
-;;               (into {} (map tf) x)
-;;               x))]
-;;     (walk/postwalk walker m)))
-
 (defn normalize-props
   [props]
   (clj->js props :keyword-fn (fn [key]
@@ -196,28 +168,3 @@
           nm (str/trim (str/lower name))]
       (str/includes? nm st))))
 
-;; (defn coalesce
-;;   [^number v ^number n]
-;;   (if (.-toFixed v)
-;;     (js/parseFloat (.toFixed v n))
-;;     0))
-
-
-
-;; (defmacro mirror-map [& fields]
-;;   (let [keys# (map #(keyword (name %)) fields)
-;;         vals# fields]
-;;     (apply hash-map (interleave keys# vals#))))
-
-;; (defmacro some->'
-;;   [x & forms]
-;;   `(let [x# (p/then' ~x (fn [v#]
-;;                           (when (nil? v#)
-;;                             (throw (ex-info "internal" {::some-interrupt true})))
-;;                           v#))]
-;;      (-> (-> x# ~@forms)
-;;          (p/catch' (fn [e#]
-;;                      (if (::some-interrupt (ex-data e#))
-;;                        nil
-;;                        (throw e#)))))))
-

frontend/src/app/util/import/parser.cljs

@@ -201,7 +201,13 @@
         (merge (add-attrs {} (:attrs svg-node)) node-attrs))
 
       (= type :svg-raw)
-      (->> node :content last)
+      (let [svg-content (get-data node :penpot:svg-content)
+            tag (-> svg-content :attrs :penpot:tag keyword)
+
+            svg-node (if (= :svg tag)
+                       (->> node :content last :content last)
+                       (->> node :content last))]
+        (merge (add-attrs {} (:attrs svg-node)) node-attrs))
 
       :else
       node-attrs)))

frontend/src/app/worker/export.cljs

@@ -450,14 +450,22 @@
   [{:keys [team-id files export-type] :as message}]
 
   (->> (rx/from files)
-       (rx/mapcat #(export-file team-id % export-type))
+       (rx/mapcat
-       (rx/map
+        (fn [file]
-        (fn [value]
+          (->> (export-file team-id file export-type)
-          (if (contains? value :type)
+               (rx/map
-            value
+                (fn [value]
-            (let [[file export-blob] value]
+                  (if (contains? value :type)
-              {:type :finish
+                    value
-               :filename (:name file)
+                    (let [[file export-blob] value]
-               :mtype "application/penpot"
+                      {:type :finish
-               :description "Penpot export (*.penpot)"
+                       :file-id (:id file)
-               :uri (dom/create-uri export-blob)}))))))
+                       :filename (:name file)
+                       :mtype "application/penpot"
+                       :description "Penpot export (*.penpot)"
+                       :uri (dom/create-uri export-blob)}))))
+               (rx/catch
+                   (fn [err]
+                     (rx/of {:type :error
+                             :error (str err)
+                             :file-id file}))))))))

frontend/translations/en.po

@@ -855,6 +855,9 @@ msgstr "You are seeing version %s"
 msgid "labels.accept"
 msgstr "Accept"
 
+msgid "labels.close"
+msgstr "Close"
+
 msgid "labels.add-custom-font"
 msgstr "Add custom font"
 
@@ -2746,4 +2749,4 @@ msgid "workspace.updates.update"
 msgstr "Update"
 
 msgid "workspace.viewport.click-to-close-path"
-msgstr "Click to close the path"
+msgstr "Click to close the path"

frontend/translations/es.po

@@ -855,6 +855,9 @@ msgstr "Estás viendo la versión %s"
 msgid "labels.accept"
 msgstr "Aceptar"
 
+msgid "labels.close"
+msgstr "Cerrar"
+
 msgid "labels.add-custom-font"
 msgstr "Añadir fuentes personalizada"
 
@@ -2742,4 +2745,4 @@ msgid "workspace.updates.update"
 msgstr "Actualizar"
 
 msgid "workspace.viewport.click-to-close-path"
-msgstr "Pulsar para cerrar la ruta"
+msgstr "Pulsar para cerrar la ruta"