♻️ Refactor modal/hide! function calls (#6415)

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

@@ -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]

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

@@ -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"

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

@@ -890,9 +890,7 @@
            (let [data (:clean-data @form)]
              (if (:id data)
                (on-update-submit form)
-               (on-create-submit form)))))
+               (on-create-submit form)))))]
-
-        on-modal-close #(st/emit! (modal/hide))]
     [: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]

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

@@ -84,10 +84,7 @@
            (when (kbd/enter? e)
              (dom/prevent-default e)
              (dom/stop-propagation e)
-             (on-submit form e))))
+             (on-submit form e))))]
-
-        on-close
-        (mf/use-fn #(st/emit! (modal/hide)))]
 
     [: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"

frontend/src/app/main/ui/onboarding/templates.cljs

@@ -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

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

@@ -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)

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

@@ -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

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

@@ -29,11 +29,8 @@
   {::mf/register modal/components
    ::mf/register-as :delete-account}
   []
-  (let [on-close
+  (let [on-accept
-        (mf/use-callback #(st/emit! (modal/hide)))
+        (mf/use-fn
-
-        on-accept
-        (mf/use-callback
          #(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)

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

@@ -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 %})))
+        update-small (mf/use-fn #(st/emit! (dw/update-nudge {:small %})))]
-        on-close     (mf/use-fn #(modal/hide!))]
 
     (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)

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

@@ -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"})

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

@@ -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"

frontend/src/app/main/ui/workspace/tokens/modals/themes.cljs

@@ -38,10 +38,7 @@
   (let [create-theme
         (mf/use-fn
          (mf/deps change-view)
-         #(change-view :create-theme))
+         #(change-view :create-theme))]
-        close-modal
-        (mf/use-fn
-         #(st/emit! (modal/hide)))]
     [: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)))
+           (change-view :create-theme)))]
-
-        close-modal
-        (mf/use-fn
-         #(st/emit! (modal/hide)))]
 
     [: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"