✨ Add check to avoid open files with components v1

common/src/app/common/features.cljc

@@ -241,7 +241,13 @@
                    :code :file-feature-mismatch
                    :feature (first not-supported)
                    :hint (str/ffmt "file features '%' not enabled"
-                                   (str/join "," not-supported))))))
+                                   (str/join "," not-supported)))))
+
+     ;; Components v1 is deprecated
+     (when-not (contains? file-features "components/v2")
+       (ex/raise :type :restriction
+                 :code :file-in-components-v1
+                 :hint "components v1 is deprecated")))
 
    enabled-features))
 

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: " ";
+}

frontend/translations/en.po

@@ -1237,6 +1237,18 @@ msgstr ""
 "features of the file you are trying to open. Migrations for '%s' need to be "
 "applied before the file can be opened."
 
+msgid "errors.deprecated"
+msgstr "Sorry! This is an old file that uses a deprecated type of Penpot assets and you can't open it."
+
+msgid "errors.deprecated.contact.before"
+msgstr "Although Penpot no longer support this type of Assets, you can"
+
+msgid "errors.deprecated.contact.text"
+msgstr "contact us"
+
+msgid "errors.deprecated.contact.after"
+msgstr "so we can help you."
+
 #: src/app/main/data/auth.cljs:322, src/app/main/ui/auth/login.cljs:81, src/app/main/ui/auth/login.cljs:122, src/app/main/ui/auth/register.cljs:66, src/app/main/ui/auth/register.cljs:207, src/app/main/ui/auth/verify_token.cljs:94, src/app/main/ui/dashboard/team.cljs:193, src/app/main/ui/onboarding/team_choice.cljs:112, src/app/main/ui/settings/access_tokens.cljs:80, src/app/main/ui/settings/feedback.cljs:49
 msgid "errors.generic"
 msgstr "Something wrong has happened."

frontend/translations/es.po

@@ -1245,6 +1245,18 @@ msgstr ""
 "del fichero que se esta intentando abrir. Falta aplicar migraciones para "
 "'%s' antes de poder abrir el fichero."
 
+msgid "errors.deprecated"
+msgstr "¡Lo sentimos! Este es un fichero antiguo que utiliza un tipo de recurso de Penpot obsoleto, y no puedes abrirlo."
+
+msgid "errors.deprecated.contact.before"
+msgstr "Aunque Penpot ya no da soporte a este tipo de Recursos, puedes"
+
+msgid "errors.deprecated.contact.text"
+msgstr "contactar con nosotros"
+
+msgid "errors.deprecated.contact.after"
+msgstr "para que podamos ayudarte."
+
 #: src/app/main/data/auth.cljs:322, src/app/main/ui/auth/login.cljs:81, src/app/main/ui/auth/login.cljs:122, src/app/main/ui/auth/register.cljs:66, src/app/main/ui/auth/register.cljs:207, src/app/main/ui/auth/verify_token.cljs:94, src/app/main/ui/dashboard/team.cljs:193, src/app/main/ui/onboarding/team_choice.cljs:112, src/app/main/ui/settings/access_tokens.cljs:80, src/app/main/ui/settings/feedback.cljs:49
 msgid "errors.generic"
 msgstr "Ha ocurrido algún error."