Merge pull request #5359 from penpot/alotor-fixes-2

🐛 Fix problem with scroll in history versions

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

@@ -24,6 +24,7 @@
    [app.main.data.workspace.libraries :as dwl]
    [app.main.data.workspace.shortcuts :as sc]
    [app.main.data.workspace.undo :as dwu]
+   [app.main.data.workspace.versions :as dwv]
    [app.main.features :as features]
    [app.main.refs :as refs]
    [app.main.store :as st]
@@ -537,6 +538,19 @@
            (when (kbd/enter? event)
              (on-show-version-history event))))
 
+        on-pin-version
+        (mf/use-fn
+         (mf/deps file-id)
+         (fn [_]
+           (st/emit! (dwv/create-version file-id))))
+
+        on-pin-version-key-down
+        (mf/use-fn
+         (mf/deps on-pin-version)
+         (fn [event]
+           (when (kbd/enter? event)
+             (on-pin-version event))))
+
         on-export-shapes
         (mf/use-fn #(st/emit! (de/show-workspace-export-dialog {:origin "workspace:menu"})))
 
@@ -599,6 +613,15 @@
           [:span {:class (stl/css :item-name)}
            (tr "dashboard.add-shared")]]))
 
+     [:div {:class (stl/css :separator)}]
+
+     [:> dropdown-menu-item* {:class (stl/css :submenu-item)
+                              :on-click    on-pin-version
+                              :on-key-down on-pin-version-key-down
+                              :id          "file-menu-show-version-history"}
+      [:span {:class (stl/css :item-name)}
+       (tr "dashboard.create-version-menu")]]
+
      [:> dropdown-menu-item* {:class (stl/css :submenu-item)
                               :on-click    on-show-version-history
                               :on-key-down on-show-version-history-key-down
@@ -606,6 +629,8 @@
       [:span {:class (stl/css :item-name)}
        (tr "dashboard.show-version-history")]]
 
+     [:div {:class (stl/css :separator)}]
+
      [:> dropdown-menu-item* {:class (stl/css :submenu-item)
                               :on-click    on-export-shapes
                               :on-key-down on-export-shapes-key-down

frontend/src/app/main/ui/workspace/main_menu.scss

@@ -43,9 +43,12 @@
 }
 
 .separator {
-  margin-top: $s-8;
+  border-top: $s-1 solid var(--color-background-quaternary);
   height: $s-4;
-  border-top: $s-1 solid var(--color-background-secondary);
+  left: calc(-1 * $s-4);
+  margin-top: $s-8;
+  position: relative;
+  width: calc(100% + $s-8);
 }
 
 .shortcut {

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

@@ -237,15 +237,11 @@
          [:& comments-sidebar]
 
          (true? is-history?)
-         [:> tab-switcher* {:tabs #js [#js {:label "History" :id "history" :content versions-tab}
+         [:> tab-switcher*
-                                       #js {:label "Actions" :id "actions" :content history-tab}]
+          {:tabs #js [#js {:label (tr "workspace.versions.tab.history") :id "history" :content versions-tab}
+                      #js {:label (tr "workspace.versions.tab.actions") :id "actions" :content history-tab}]
            :default-selected "history"
-                            ;;:selected (name section)
+           :class (stl/css :left-sidebar-tabs)}]
-                            ;;:on-change-tab on-tab-change
-                            :class (stl/css :left-sidebar-tabs)
-                            ;;:action-button-position "start"
-                            ;;:action-button (mf/html [:& collapse-button {:on-click handle-collapse}])
-                            }]
 
          :else
          [:> options-toolbox props])]]]))

frontend/src/app/main/ui/workspace/sidebar.scss

@@ -113,4 +113,5 @@ $width-settings-bar-max: $s-500;
 .versions-tab {
   width: 100%;
   overflow: hidden;
+  height: calc(100vh - $s-88);
 }

frontend/src/app/main/ui/workspace/sidebar/versions.scss

@@ -8,6 +8,10 @@
 
 .version-toolbox {
   padding: $s-8;
+  height: 100%;
+  display: grid;
+  overflow: hidden;
+  grid-template-rows: auto auto 1fr;
 }
 
 .versions-entry-empty {
@@ -49,6 +53,8 @@
   display: flex;
   flex-direction: column;
   gap: $s-6;
+  overflow: auto;
+  margin: 0;
 }
 
 .version-entry {

frontend/translations/en.po

@@ -400,6 +400,9 @@ msgstr "Add as Shared Library"
 msgid "dashboard.show-version-history"
 msgstr "Version history"
 
+msgid "dashboard.create-version-menu"
+msgstr "Pin this version"
+
 #: src/app/main/ui/settings/profile.cljs:72
 msgid "dashboard.change-email"
 msgstr "Change email"
@@ -6565,3 +6568,9 @@ msgstr "Open version menu"
 #, unused
 msgid "workspace.viewport.click-to-close-path"
 msgstr "Click to close the path"
+
+msgid "workspace.versions.tab.history"
+msgstr "History"
+
+msgid "workspace.versions.tab.actions"
+msgstr "Actions"

frontend/translations/es.po

@@ -402,6 +402,9 @@ msgstr "Añadir como Biblioteca Compartida"
 msgid "dashboard.show-version-history"
 msgstr "Histórico de versiones"
 
+msgid "dashboard.create-version-menu"
+msgstr "Guardar esta versión"
+
 #: src/app/main/ui/settings/profile.cljs:72
 msgid "dashboard.change-email"
 msgstr "Cambiar correo"
@@ -6560,3 +6563,9 @@ msgstr "Abrir menu de versiones"
 #, unused
 msgid "workspace.viewport.click-to-close-path"
 msgstr "Pulsar para cerrar la ruta"
+
+msgid "workspace.versions.tab.history"
+msgstr "Histórico"
+
+msgid "workspace.versions.tab.actions"
+msgstr "Acciones"