✨ Add check to avoid open files with components v1

frontend/src/app/main/errors.cljs

@@ -260,6 +260,14 @@
     (let [message (tr "errors.feature-not-supported" (:feature error))]
       (st/emit! (modal/show {:type :alert :message message})))
 
+    (= :file-in-components-v1 code)
+    (st/emit! (modal/show {:type :alert
+                           :message (tr "errors.deprecated")
+                           :link-message {:before (tr "errors.deprecated.contact.before")
+                                          :text (tr "errors.deprecated.contact.text")
+                                          :after (tr "errors.deprecated.contact.after")
+                                          :on-click #(st/emit! (rt/nav :settings-feedback))}}))
+
     :else
     (print-cause! "Restriction Error" error)))
 

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

@@ -9,6 +9,7 @@
   (:require
    [app.main.data.modal :as modal]
    [app.main.store :as st]
+   [app.main.ui.components.link :as lk]
    [app.main.ui.icons :as i]
    [app.util.dom :as dom]
    [app.util.i18n :as i18n :refer [tr]]
@@ -21,6 +22,7 @@
    ::mf/register-as :alert}
   [{:keys [message
            scd-message
+           link-message
            title
            on-accept
            hint
@@ -59,8 +61,16 @@
       [:div {:class (stl/css :modal-content)}
        (when (and (string? message) (not= message ""))
          [:h3 {:class (stl/css :modal-msg)} message])
+       (when (seq link-message)
+         [:h3 {:class (stl/css :modal-msg)}
+          [:span (:before link-message)]
+          [:& lk/link {:action (:on-click link-message)
+                       :class (stl/css :link)}
+           (:text link-message)]
+          [:span (:after link-message)]])
        (when (and (string? scd-message) (not= scd-message ""))
          [:h3 {:class (stl/css :modal-scd-msg)} scd-message])
+
        (when (string? hint)
          [:p {:class (stl/css :modal-hint)} hint])]
 

frontend/src/app/main/ui/alert.scss

@@ -8,10 +8,12 @@
 
 .modal-overlay {
   @extend .modal-overlay-base;
+
   &.transparent {
     background-color: transparent;
   }
 }
+
 .modal-container {
   @extend .modal-container-base;
 }
@@ -48,6 +50,7 @@
 
 .accept-btn {
   @extend .modal-accept-btn;
+
   &.danger {
     @extend .modal-danger-btn;
   }
@@ -60,3 +63,15 @@
   color: var(--modal-text-foreground-color);
   line-height: 1.5;
 }
+
+.link {
+  color: var(--color-accent-primary);
+}
+
+.link::before {
+  content: " ";
+}
+
+.link::after {
+  content: " ";
+}