mirror of
https://github.com/penpot/penpot.git
synced 2025-05-26 00:46:10 +02:00
♻️ Refactor modal/hide! function calls (#6415)
This commit is contained in:
parent
751bed4117
commit
0f3a4db71e
12 changed files with 39 additions and 67 deletions
|
@ -176,7 +176,7 @@
|
|||
:plugin-try-out
|
||||
{:plugin plugin
|
||||
:on-accept #(create-file! plugin)
|
||||
:on-close #(modal/hide!)}))
|
||||
:on-close modal/hide!}))
|
||||
|
||||
open-permissions-dialog
|
||||
(fn [plugin]
|
||||
|
|
|
@ -9,7 +9,6 @@
|
|||
(:require
|
||||
[app.common.schema :as sm]
|
||||
[app.main.data.modal :as modal]
|
||||
[app.main.store :as st]
|
||||
[app.main.ui.components.forms :as fm]
|
||||
[app.main.ui.icons :as i]
|
||||
[app.util.i18n :as i18n :refer [tr]]
|
||||
|
@ -34,7 +33,6 @@
|
|||
(map #(hash-map :label (:name %) :value (str (:id %)))))
|
||||
members)
|
||||
|
||||
on-cancel #(st/emit! (modal/hide))
|
||||
on-accept
|
||||
(fn [_]
|
||||
(let [member-id (get-in @form [:clean-data :member-id])]
|
||||
|
@ -45,7 +43,7 @@
|
|||
[:div {:class (stl/css :modal-header)}
|
||||
[:h2 {:class (stl/css :modal-title)} (tr "modals.leave-and-reassign.title")]
|
||||
[:button {:class (stl/css :modal-close-btn)
|
||||
:on-click on-cancel} i/close]]
|
||||
:on-click modal/hide!} i/close]]
|
||||
|
||||
[:div {:class (stl/css :modal-content)}
|
||||
[:p {:class (stl/css :modal-msg)}
|
||||
|
@ -64,7 +62,7 @@
|
|||
[:input {:class (stl/css :cancel-button)
|
||||
:type "button"
|
||||
:value (tr "labels.cancel")
|
||||
:on-click on-cancel}]
|
||||
:on-click modal/hide!}]
|
||||
|
||||
[:input.accept-button
|
||||
{:type "button"
|
||||
|
|
|
@ -890,9 +890,7 @@
|
|||
(let [data (:clean-data @form)]
|
||||
(if (:id data)
|
||||
(on-update-submit form)
|
||||
(on-create-submit form)))))
|
||||
|
||||
on-modal-close #(st/emit! (modal/hide))]
|
||||
(on-create-submit form)))))]
|
||||
[:div {:class (stl/css :modal-overlay)}
|
||||
[:div {:class (stl/css :modal-container)}
|
||||
[:& fm/form {:form form :on-submit on-submit}
|
||||
|
@ -903,7 +901,7 @@
|
|||
(tr "modals.create-webhook.title"))]
|
||||
|
||||
[:button {:class (stl/css :modal-close-btn)
|
||||
:on-click on-modal-close} i/close]]
|
||||
:on-click modal/hide!} i/close]]
|
||||
|
||||
[:div {:class (stl/css :modal-content)}
|
||||
[:div {:class (stl/css :fields-row)}
|
||||
|
@ -931,7 +929,7 @@
|
|||
[:input {:class (stl/css :cancel-button)
|
||||
:type "button"
|
||||
:value (tr "labels.cancel")
|
||||
:on-click #(modal/hide!)}]
|
||||
:on-click modal/hide!}]
|
||||
[:> fm/submit-button*
|
||||
{:label (if webhook
|
||||
(tr "modals.edit-webhook.submit-label")
|
||||
|
@ -1097,7 +1095,7 @@
|
|||
(:is-admin permissions))
|
||||
|
||||
on-image-click
|
||||
(mf/use-callback #(dom/click (mf/ref-val finput)))
|
||||
(mf/use-fn #(dom/click (mf/ref-val finput)))
|
||||
|
||||
on-file-selected
|
||||
(fn [file]
|
||||
|
|
|
@ -84,10 +84,7 @@
|
|||
(when (kbd/enter? e)
|
||||
(dom/prevent-default e)
|
||||
(dom/stop-propagation e)
|
||||
(on-submit form e))))
|
||||
|
||||
on-close
|
||||
(mf/use-fn #(st/emit! (modal/hide)))]
|
||||
(on-submit form e))))]
|
||||
|
||||
[:div {:class (stl/css :modal-overlay)}
|
||||
[:div {:class (stl/css :modal-container)}
|
||||
|
@ -103,7 +100,7 @@
|
|||
(tr "labels.create-team")])
|
||||
|
||||
[:button {:class (stl/css :modal-close-btn)
|
||||
:on-click on-close} i/close]]
|
||||
:on-click modal/hide!} i/close]]
|
||||
|
||||
[:div {:class (stl/css :modal-content)}
|
||||
[:& fm/input {:type "text"
|
||||
|
|
|
@ -63,14 +63,13 @@
|
|||
;; when a user creates a new team just after signup.
|
||||
[props]
|
||||
(let [project-id (unchecked-get props "project-id")
|
||||
close-fn (mf/use-callback #(st/emit! (modal/hide)))
|
||||
profile (mf/deref refs/profile)
|
||||
project-id (or project-id (:default-project-id profile))]
|
||||
[:div.modal-overlay
|
||||
[:div.modal-container.onboarding-templates
|
||||
[:div.modal-header
|
||||
[:div.modal-close-button
|
||||
{:on-click close-fn
|
||||
{:on-click modal/hide!
|
||||
:data-testid "close-templates-btn"} i/close]]
|
||||
|
||||
[:div.modal-content
|
||||
|
|
|
@ -169,12 +169,12 @@
|
|||
[:input {:class (stl/css :cancel-button)
|
||||
:type "button"
|
||||
:value (tr "labels.close")
|
||||
:on-click #(modal/hide!)}]
|
||||
:on-click modal/hide!}]
|
||||
[:*
|
||||
[:input {:class (stl/css :cancel-button)
|
||||
:type "button"
|
||||
:value (tr "labels.cancel")
|
||||
:on-click #(modal/hide!)}]
|
||||
:on-click modal/hide!}]
|
||||
[:> fm/submit-button*
|
||||
{:large? false :label (tr "modals.create-access-token.submit-label")}]])]]]]]))
|
||||
|
||||
|
@ -210,7 +210,7 @@
|
|||
(swap! local assoc :menu-open true)))
|
||||
|
||||
on-keydown
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(mf/deps on-menu-click)
|
||||
(fn [event]
|
||||
(when (kbd/enter? event)
|
||||
|
|
|
@ -73,8 +73,6 @@
|
|||
(let [profile (mf/deref refs/profile)
|
||||
form (fm/use-form :schema schema:email-change-form
|
||||
:initial profile)
|
||||
on-close
|
||||
(mf/use-fn #(st/emit! (modal/hide)))
|
||||
|
||||
on-submit
|
||||
(mf/use-fn
|
||||
|
@ -91,7 +89,7 @@
|
|||
:data-testid "change-email-title"}
|
||||
(tr "modals.change-email.title")]
|
||||
[:button {:class (stl/css :modal-close-btn)
|
||||
:on-click on-close} i/close]]
|
||||
:on-click modal/hide!} i/close]]
|
||||
|
||||
[:div {:class (stl/css :modal-content)}
|
||||
[:& context-notification
|
||||
|
|
|
@ -29,11 +29,8 @@
|
|||
{::mf/register modal/components
|
||||
::mf/register-as :delete-account}
|
||||
[]
|
||||
(let [on-close
|
||||
(mf/use-callback #(st/emit! (modal/hide)))
|
||||
|
||||
on-accept
|
||||
(mf/use-callback
|
||||
(let [on-accept
|
||||
(mf/use-fn
|
||||
#(st/emit! (modal/hide)
|
||||
(du/request-account-deletion
|
||||
(with-meta {} {:on-error on-error}))))]
|
||||
|
@ -45,7 +42,7 @@
|
|||
|
||||
[:h2 {:class (stl/css :modal-title)} (tr "modals.delete-account.title")]
|
||||
[:button {:class (stl/css :modal-close-btn)
|
||||
:on-click on-close} i/close]]
|
||||
:on-click modal/hide!} i/close]]
|
||||
|
||||
[:div {:class (stl/css :modal-content)}
|
||||
[:& context-notification
|
||||
|
@ -55,7 +52,7 @@
|
|||
[:div {:class (stl/css :modal-footer)}
|
||||
[:div {:class (stl/css :action-buttons)}
|
||||
[:button {:class (stl/css :cancel-button)
|
||||
:on-click on-close}
|
||||
:on-click modal/hide!}
|
||||
(tr "modals.delete-account.cancel")]
|
||||
[:button {:class (stl/css-case :accept-button true
|
||||
:danger true)
|
||||
|
|
|
@ -34,8 +34,7 @@
|
|||
(let [profile (mf/deref refs/profile)
|
||||
nudge (or (get-in profile [:props :nudge]) {:big 10 :small 1})
|
||||
update-big (mf/use-fn #(st/emit! (dw/update-nudge {:big %})))
|
||||
update-small (mf/use-fn #(st/emit! (dw/update-nudge {:small %})))
|
||||
on-close (mf/use-fn #(modal/hide!))]
|
||||
update-small (mf/use-fn #(st/emit! (dw/update-nudge {:small %})))]
|
||||
|
||||
(mf/with-effect
|
||||
(->> (events/listen js/document EventType.KEYDOWN on-keydown)
|
||||
|
@ -46,7 +45,7 @@
|
|||
[:div {:class (stl/css :modal-header)}
|
||||
[:h2 {:class (stl/css :modal-title)} (tr "modals.nudge-title")]
|
||||
[:button {:class (stl/css :modal-close-btn)
|
||||
:on-click on-close} i/close]]
|
||||
:on-click modal/hide!} i/close]]
|
||||
[:div {:class (stl/css :modal-content)}
|
||||
[:div {:class (stl/css :input-wrapper)}
|
||||
[:label {:class (stl/css :modal-msg)
|
||||
|
|
|
@ -54,14 +54,14 @@
|
|||
(not is-edition-plugin?))
|
||||
|
||||
handle-open-click
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(mf/deps index manifest on-open-plugin can-open?)
|
||||
(fn []
|
||||
(when (and can-open? on-open-plugin)
|
||||
(on-open-plugin manifest))))
|
||||
|
||||
handle-delete-click
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(mf/deps index on-remove-plugin)
|
||||
(fn []
|
||||
(when on-remove-plugin
|
||||
|
@ -109,19 +109,14 @@
|
|||
|
||||
user-can-edit? (:can-edit (deref refs/permissions))
|
||||
|
||||
handle-close-dialog
|
||||
(mf/use-callback
|
||||
(fn []
|
||||
(modal/hide!)))
|
||||
|
||||
handle-url-input
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [value]
|
||||
(reset! input-status* nil)
|
||||
(reset! plugin-url* value)))
|
||||
|
||||
handle-install-click
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(mf/deps plugins-state plugin-url)
|
||||
(fn []
|
||||
(reset! fetching-manifest? true)
|
||||
|
@ -149,7 +144,7 @@
|
|||
(reset! input-status* :error-url))))))
|
||||
|
||||
handle-open-plugin
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [manifest]
|
||||
(st/emit! (ptk/event ::ev/event {::ev/name "start-plugin"
|
||||
::ev/origin "workspace:plugins"
|
||||
|
@ -159,7 +154,7 @@
|
|||
(modal/hide!)))
|
||||
|
||||
handle-remove-plugin
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(mf/deps plugins-state)
|
||||
(fn [plugin-index]
|
||||
(let [plugins-list (preg/plugins-list)
|
||||
|
@ -173,7 +168,7 @@
|
|||
|
||||
[:div {:class (stl/css :modal-overlay)}
|
||||
[:div {:class (stl/css :modal-dialog :plugin-management)}
|
||||
[:button {:class (stl/css :close-btn) :on-click handle-close-dialog} close-icon]
|
||||
[:button {:class (stl/css :close-btn) :on-click modal/hide!} close-icon]
|
||||
[:div {:class (stl/css :modal-title)} (tr "workspace.plugins.title")]
|
||||
|
||||
[:div {:class (stl/css :modal-content)}
|
||||
|
@ -291,7 +286,7 @@
|
|||
permissions (set permissions)
|
||||
|
||||
handle-accept-dialog
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [event]
|
||||
(dom/prevent-default event)
|
||||
(st/emit! (ptk/event ::ev/event {::ev/name "allow-plugin-permissions"
|
||||
|
@ -301,7 +296,7 @@
|
|||
(when on-accept (on-accept))))
|
||||
|
||||
handle-close-dialog
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [event]
|
||||
(dom/prevent-default event)
|
||||
(st/emit! (ptk/event ::ev/event {::ev/name "reject-plugin-permissions"
|
||||
|
@ -346,7 +341,7 @@
|
|||
permissions (set permissions)
|
||||
|
||||
handle-accept-dialog
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [event]
|
||||
(dom/prevent-default event)
|
||||
(st/emit! (ptk/event ::ev/event {::ev/name "allow-plugin-permissions"
|
||||
|
@ -356,7 +351,7 @@
|
|||
(when on-accept (on-accept))))
|
||||
|
||||
handle-close-dialog
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [event]
|
||||
(dom/prevent-default event)
|
||||
(st/emit! (ptk/event ::ev/event {::ev/name "reject-plugin-permissions"
|
||||
|
@ -399,7 +394,7 @@
|
|||
(let [{:keys [icon host name]} plugin
|
||||
|
||||
handle-accept-dialog
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [event]
|
||||
(dom/prevent-default event)
|
||||
(st/emit! (ptk/event ::ev/event {::ev/name "try-out-accept"})
|
||||
|
@ -407,7 +402,7 @@
|
|||
(when on-accept (on-accept))))
|
||||
|
||||
handle-close-dialog
|
||||
(mf/use-callback
|
||||
(mf/use-fn
|
||||
(fn [event]
|
||||
(dom/prevent-default event)
|
||||
(st/emit! (ptk/event ::ev/event {::ev/name "try-out-cancel"})
|
||||
|
|
|
@ -107,8 +107,6 @@
|
|||
|
||||
create? (empty? path)
|
||||
|
||||
on-close (mf/use-fn #(modal/hide!))
|
||||
|
||||
on-accept
|
||||
(mf/use-fn
|
||||
(mf/deps form)
|
||||
|
@ -127,7 +125,7 @@
|
|||
(tr "workspace.assets.create-group")
|
||||
(tr "workspace.assets.rename-group"))]
|
||||
[:button {:class (stl/css :modal-close-btn)
|
||||
:on-click on-close} i/close]]
|
||||
:on-click modal/hide!} i/close]]
|
||||
|
||||
[:div {:class (stl/css :modal-content)}
|
||||
[:& fm/form {:form form :on-submit on-accept}
|
||||
|
@ -143,7 +141,7 @@
|
|||
{:class (stl/css :cancel-button)
|
||||
:type "button"
|
||||
:value (tr "labels.cancel")
|
||||
:on-click on-close}]
|
||||
:on-click modal/hide!}]
|
||||
|
||||
[:input
|
||||
{:type "button"
|
||||
|
|
|
@ -38,10 +38,7 @@
|
|||
(let [create-theme
|
||||
(mf/use-fn
|
||||
(mf/deps change-view)
|
||||
#(change-view :create-theme))
|
||||
close-modal
|
||||
(mf/use-fn
|
||||
#(st/emit! (modal/hide)))]
|
||||
#(change-view :create-theme))]
|
||||
[:div {:class (stl/css :themes-modal-wrapper)}
|
||||
[:> heading* {:level 2 :typography "headline-medium" :class (stl/css :themes-modal-title)}
|
||||
(tr "workspace.token.themes-list")]
|
||||
|
@ -56,7 +53,7 @@
|
|||
[:div {:class (stl/css :button-footer)}
|
||||
[:> button* {:variant "secondary"
|
||||
:type "button"
|
||||
:on-click close-modal}
|
||||
:on-click modal/hide!}
|
||||
(tr "labels.close")]
|
||||
[:> button* {:variant "primary"
|
||||
:type "button"
|
||||
|
@ -89,11 +86,7 @@
|
|||
(fn [e]
|
||||
(dom/prevent-default e)
|
||||
(dom/stop-propagation e)
|
||||
(change-view :create-theme)))
|
||||
|
||||
close-modal
|
||||
(mf/use-fn
|
||||
#(st/emit! (modal/hide)))]
|
||||
(change-view :create-theme)))]
|
||||
|
||||
[:div {:class (stl/css :themes-modal-wrapper)}
|
||||
[:> heading* {:level 2 :typography "headline-medium" :class (stl/css :themes-modal-title)}
|
||||
|
@ -163,7 +156,7 @@
|
|||
[:div {:class (stl/css :button-footer)}
|
||||
[:> button* {:variant "secondary"
|
||||
:type "button"
|
||||
:on-click close-modal}
|
||||
:on-click modal/hide!}
|
||||
(tr "labels.close")]
|
||||
[:> button* {:variant "primary"
|
||||
:type "button"
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue