mirror of
https://github.com/penpot/penpot.git
synced 2025-05-05 12:45:52 +02:00
✨ Temporary UI
This commit is contained in:
alonso.torres
Andrés Moya
parent
61545ea13e
commit
d855b930c5
5 changed files with 82 additions and 13 deletions
|
|
@ -165,3 +165,30 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.import-file-btn {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 2rem;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
padding: 4px;
|
||||
width: 2rem;
|
||||
|
||||
background: none;
|
||||
border: 1px solid $color-gray-20;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
transition: all 0.4s;
|
||||
margin-left: 1rem;
|
||||
|
||||
&:hover {
|
||||
background: $color-primary;
|
||||
}
|
||||
|
||||
svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,8 +11,9 @@
|
|||
[app.main.data.modal :as modal]
|
||||
[app.main.repo :as rp]
|
||||
[app.main.store :as st]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.ui.components.context-menu :refer [context-menu]]
|
||||
[app.main.ui.context :as ctx]
|
||||
[app.main.worker :as uw]
|
||||
[app.util.dom :as dom]
|
||||
[app.util.i18n :as i18n :refer [tr]]
|
||||
[app.util.router :as rt]
|
||||
|
|
@ -150,7 +151,22 @@
|
|||
:hint (tr "modals.remove-shared-confirm.hint")
|
||||
:cancel-label :omit
|
||||
:accept-label (tr "modals.remove-shared-confirm.accept")
|
||||
:on-accept del-shared})))]
|
||||
:on-accept del-shared})))
|
||||
|
||||
on-export-files
|
||||
(fn [event]
|
||||
(->> (uw/ask-many!
|
||||
{:cmd :export-file
|
||||
:team-id current-team-id
|
||||
:files files})
|
||||
(rx/subs
|
||||
(fn [{:keys [type data] :as msg}]
|
||||
(case type
|
||||
:progress
|
||||
(prn "[Progress]" data)
|
||||
|
||||
:finish
|
||||
(dom/save-as data "export" "application/zip" "Export package (*.zip)"))))))]
|
||||
|
||||
(mf/use-effect
|
||||
(fn []
|
||||
|
|
@ -176,6 +192,7 @@
|
|||
[[(tr "dashboard.duplicate-multi" file-count) on-duplicate]
|
||||
(when (or (seq current-projects) (seq other-teams))
|
||||
[(tr "dashboard.move-to-multi" file-count) nil sub-options])
|
||||
#_[(tr "dashboard.export-multi" file-count) on-export-files]
|
||||
[:separator]
|
||||
[(tr "labels.delete-multi-files" file-count) on-delete]]
|
||||
|
||||
|
|
@ -187,6 +204,7 @@
|
|||
(if (:is-shared file)
|
||||
[(tr "dashboard.remove-shared") on-del-shared]
|
||||
[(tr "dashboard.add-shared") on-add-shared])
|
||||
#_[(tr "dashboard.export-single") on-export-files]
|
||||
[:separator]
|
||||
[(tr "labels.delete") on-delete]])]
|
||||
|
||||
|
|
|
|||
|
|
@ -14,12 +14,12 @@
|
|||
[beicon.core :as rx]
|
||||
[rumext.alpha :as mf]))
|
||||
|
||||
(log/set-level! :warn)
|
||||
(log/set-level! :debug)
|
||||
|
||||
(defn use-import-file
|
||||
[project-id]
|
||||
[project-id on-finish-import]
|
||||
(mf/use-callback
|
||||
(mf/deps project-id)
|
||||
(mf/deps project-id on-finish-import)
|
||||
(fn [files]
|
||||
(when files
|
||||
(let [files (->> files (mapv dom/create-uri))]
|
||||
|
|
@ -30,16 +30,23 @@
|
|||
|
||||
(rx/subs
|
||||
(fn [result]
|
||||
(log/debug :action "import-result" :result result)))))))))
|
||||
(log/debug :action "import-result" :result result))
|
||||
|
||||
(fn [err]
|
||||
(log/debug :action "import-error" :result err))
|
||||
|
||||
(fn []
|
||||
(log/debug :action "import-end")
|
||||
(when on-finish-import (on-finish-import))))))))))
|
||||
|
||||
(mf/defc import-button
|
||||
[{:keys [project-id]}]
|
||||
[{:keys [project-id on-finish-import]}]
|
||||
|
||||
(let [file-input (mf/use-ref nil)
|
||||
on-file-selected (use-import-file project-id)]
|
||||
on-file-selected (use-import-file project-id on-finish-import)]
|
||||
[:form.import-file
|
||||
[:button.import-file-icon {:type "button"
|
||||
:on-click #(dom/click (mf/ref-val file-input))} i/import]
|
||||
[:button.import-file-btn {:type "button"
|
||||
:on-click #(dom/click (mf/ref-val file-input))} i/import]
|
||||
[:& file-uploader {:accept "application/zip"
|
||||
:multi true
|
||||
:input-ref file-input
|
||||
|
|
|
|||
|
|
@ -21,7 +21,8 @@
|
|||
[app.util.router :as rt]
|
||||
[app.util.time :as dt]
|
||||
[okulary.core :as l]
|
||||
[rumext.alpha :as mf]))
|
||||
[rumext.alpha :as mf]
|
||||
[app.main.ui.dashboard.import :refer [import-button]]))
|
||||
|
||||
(mf/defc header
|
||||
{::mf/wrap [mf/memo]}
|
||||
|
|
@ -30,6 +31,7 @@
|
|||
[:header.dashboard-header
|
||||
[:div.dashboard-title
|
||||
[:h1 (tr "dashboard.projects-title")]]
|
||||
|
||||
[:a.btn-secondary.btn-small {:on-click create}
|
||||
(tr "dashboard.new-project")]]))
|
||||
|
||||
|
|
@ -96,7 +98,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-finish-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
|
||||
|
|
@ -130,6 +138,9 @@
|
|||
(dt/timeago {:locale locale}))]
|
||||
[:span.recent-files-row-title-info (str ", " time)]))
|
||||
|
||||
#_[:& import-button {:project-id (:id project)
|
||||
:on-finish-import on-finish-import}]
|
||||
|
||||
[:a.btn-secondary.btn-small
|
||||
{:on-click create-file}
|
||||
(tr "dashboard.new-file")]]
|
||||
|
|
|
|||
|
|
@ -2633,4 +2633,10 @@ 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"
|
||||
|
||||
msgid "dashboard.export-single"
|
||||
msgstr "Export file"
|
||||
|
||||
msgid "dashboard.export-multi"
|
||||
msgstr "Export %s files"
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue