3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-06-05 04:51:39 +02:00
Code Issues Projects Releases Packages Wiki Activity

✨ Add test AB for adding a few "Suggested" libraries

Browse source
This commit is contained in:
Pablo Alba 2024-12-04 13:17:39 +01:00 • committed by Andrey Antukh
parent 0766b341bd
commit 257d72ee9d
4 changed files with 146 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

63
frontend/src/app/main/ui/workspace/libraries.cljs
View file

@ -15,7 +15,9 @@
[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]
[app.main.data.users :as du]
[app.main.data.workspace.colors :as mdc]
[app.main.data.workspace.libraries :as dwl]
@ -33,6 +35,7 @@
[app.util.dom :as dom]
[app.util.i18n :as i18n :refer [tr]]
[app.util.strings :refer [matches-search]]
[beicon.v2.core :as rx]
[cuerdas.core :as str]
[okulary.core :as l]
[rumext.v2 :as mf]))
@ -104,9 +107,45 @@
(tr "workspace.libraries.typography" typography-count)])])
(mf/defc sample-library-entry
[{:keys [library project-id team-id importing] :as props}]
(let [id (:id library)
importing? (deref importing)
on-error
(mf/use-fn
(fn [_]
(reset! importing nil)
(rx/of (ntf/error (tr "dashboard.libraries-and-templates.import-error")))))
on-success
(mf/use-fn
(mf/deps team-id)
(fn [_]
(st/emit! (dwl/fetch-shared-files {:team-id team-id}))))
import-library
(mf/use-fn
(fn [_]
(reset! importing id)
(st/emit! (dd/clone-template
(with-meta {:project-id project-id
:template-id id}
{:on-success on-success
:on-error on-error})))))]
[:div {:class (stl/css :sample-library-item)
:key (dm/str id)}
[:div {:class (stl/css :sample-library-item-name)} (:name library)]
[:input {:class (stl/css-case :sample-library-button true :sample-library-add (nil? importing?) :sample-library-adding (some? importing?))
:type "button"
:value (if (= importing? id) (tr "labels.adding") (tr "labels.add"))
:on-click import-library}]]))
(mf/defc libraries-tab
{::mf/wrap-props false}
[{:keys [file-id shared? linked-libraries shared-libraries]}]
[{:keys [file-id shared? linked-libraries shared-libraries team-id]}]
(let [search-term* (mf/use-state "")
search-term (deref search-term*)
library-ref (mf/with-memo [file-id]
@ -138,6 +177,12 @@
(->> (vals linked-libraries)
(sort-by (comp str/lower :name))))
importing* (mf/use-state nil)
project-id (mf/deref refs/current-project-id)
sample-libraries [{:id "penpot-design-system", :name "Design system example"}
{:id "wireframing-kit", :name "Wireframe library"}
{:id "whiteboarding-kit", :name "Whiteboarding Kit"}]
change-search-term
(mf/use-fn
(fn [event]
@ -290,6 +335,19 @@
(nil? shared-libraries)
(tr "workspace.libraries.loading")
(and (str/empty? search-term) (cf/external-feature-flag "templates-03" "test"))
[:*
[:div {:class (stl/css :sample-libraries-info)}
(tr "workspace.libraries.empty.no-libraries")
[:a {:target "_blank"
:class (stl/css :sample-libraries-link)
:href "https://penpot.app/libraries-templates"}
(tr "workspace.libraries.empty.some-templates")]]
[:div {:class (stl/css :sample-libraries-container)}
(tr "workspace.libraries.empty.add-some")
(for [library sample-libraries]
[:& sample-library-entry {:library library :project-id project-id :team-id team-id :importing importing*}])]]
(str/empty? search-term)
[:*
[:span {:class (stl/css :empty-state-icon)}
@ -519,7 +577,8 @@
:content (mf/html [:& libraries-tab {:file-id file-id
:shared? shared?
:linked-libraries libraries
:shared-libraries shared-libraries}])}
:shared-libraries shared-libraries
:team-id team-id}])}
#js {:label (tr "workspace.libraries.updates")
:id "updates"