From cb064358f86a236941c13b9e9283abe9f97b5303 Mon Sep 17 00:00:00 2001 From: Alejandro Alonso Date: Wed, 24 Aug 2022 10:26:08 +0200 Subject: [PATCH 1/4] :bug: Fix permissions when moving comments --- backend/src/app/rpc/commands/comments.clj | 16 ++++++---------- 1 file changed, 6 insertions(+), 10 deletions(-) diff --git a/backend/src/app/rpc/commands/comments.clj b/backend/src/app/rpc/commands/comments.clj index f7bf9e521..576f6599c 100644 --- a/backend/src/app/rpc/commands/comments.clj +++ b/backend/src/app/rpc/commands/comments.clj @@ -496,16 +496,14 @@ ;; --- COMMAND: Update comment thread position (s/def ::update-comment-thread-position - (s/keys :req-un [::profile-id ::id ::position ::frame-id])) + (s/keys :req-un [::profile-id ::id ::position ::frame-id ::share-id])) (sv/defmethod ::update-comment-thread-position {::doc/added "1.15"} - [{:keys [pool] :as cfg} {:keys [profile-id id position frame-id] :as params}] + [{:keys [pool] :as cfg} {:keys [profile-id id position frame-id share-id] :as params}] (db/with-atomic [conn pool] (let [thread (db/get-by-id conn :comment-thread id {:for-update true})] - (when-not (= (:owner-id thread) profile-id) - (ex/raise :type :validation - :code :not-allowed)) + (files/check-comment-permissions! conn profile-id (:file-id thread) share-id) (db/update! conn :comment-thread {:modified-at (dt/now) :position (db/pgpoint position) @@ -516,16 +514,14 @@ ;; --- COMMAND: Update comment frame (s/def ::update-comment-thread-frame - (s/keys :req-un [::profile-id ::id ::frame-id])) + (s/keys :req-un [::profile-id ::id ::frame-id ::share-id])) (sv/defmethod ::update-comment-thread-frame {::doc/added "1.15"} - [{:keys [pool] :as cfg} {:keys [profile-id id frame-id] :as params}] + [{:keys [pool] :as cfg} {:keys [profile-id id frame-id share-id] :as params}] (db/with-atomic [conn pool] (let [thread (db/get-by-id conn :comment-thread id {:for-update true})] - (when-not (= (:owner-id thread) profile-id) - (ex/raise :type :validation - :code :not-allowed)) + (files/check-comment-permissions! conn profile-id (:file-id thread) share-id) (db/update! conn :comment-thread {:modified-at (dt/now) :frame-id frame-id} From 8dfd74547ae3d917fb6a38f8ce1b533f298da6a2 Mon Sep 17 00:00:00 2001 From: Eva Date: Thu, 28 Jul 2022 09:30:17 +0200 Subject: [PATCH 2/4] :lipstick: Change some styles in viewer mode --- CHANGES.md | 1 + .../styles/main/layouts/handoff.scss | 50 +++++++++++++++++-- .../resources/styles/main/layouts/viewer.scss | 45 ++++++++++++++++- .../styles/main/partials/viewer-header.scss | 3 +- .../styles/main/partials/viewer.scss | 14 +++--- frontend/src/app/main/ui/viewer.cljs | 34 +++++++++---- frontend/src/app/main/ui/viewer/handoff.cljs | 12 ++++- 7 files changed, 135 insertions(+), 24 deletions(-) diff --git a/CHANGES.md b/CHANGES.md index c713129b5..04cbee7f2 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -24,6 +24,7 @@ ### :sparkles: New features +- Add some cosmetic changes in viewer mode [Taiga #3688](https://tree.taiga.io/project/penpot/us/3688) - Allow for nested and rotated boards inside other boards and groups [Taiga #2874](https://tree.taiga.io/project/penpot/us/2874?milestone=319982) - View mode improvements to enable access and use in different conditions [Taiga #3023](https://tree.taiga.io/project/penpot/us/3023) - Improved share link options. Now you can allow non-team members to comment and/or inspect [Taiga #3056] (https://tree.taiga.io/project/penpot/us/3056) diff --git a/frontend/resources/styles/main/layouts/handoff.scss b/frontend/resources/styles/main/layouts/handoff.scss index 3f8b6f151..ce61123d2 100644 --- a/frontend/resources/styles/main/layouts/handoff.scss +++ b/frontend/resources/styles/main/layouts/handoff.scss @@ -19,14 +19,35 @@ $width-settings-bar: 256px; } } +.fullscreen.handoff-layout.force-visible { + display: grid; + grid-template-rows: 1fr; + + & .viewer-header { + position: fixed; + top: 0; + transition: top 400ms ease 300ms; + margin-bottom: 0; + z-index: 2; + } + + & .viewer-bottom { + position: fixed; + bottom: 0; + transition: bottom 400ms ease 300ms; + z-index: 2; + } +} + .fullscreen.handoff-layout:not(.force-visible) { - .viewer-header { + & .viewer-header { width: 100%; position: fixed; top: -48px; left: 0; transition: top 400ms ease 300ms; - z-index: 25; + z-index: 2; + margin-bottom: 48px; &::after { content: " "; @@ -43,7 +64,29 @@ $width-settings-bar: 256px; transition: top 200ms; } - .viewer-content { + & .viewer-bottom { + width: 100%; + position: fixed; + bottom: -48px; + left: 0; + transition: bottom 400ms ease 300ms; + z-index: 2; + &::after { + content: " "; + position: absolute; + width: 100%; + height: 1rem; + left: 0; + bottom: 0px; + } + } + + & .viewer-bottom:hover { + bottom: 0px; + transition: bottom 200ms; + } + + & .viewer-content { grid-row: 1 / span 2; } } @@ -51,6 +94,7 @@ $width-settings-bar: 256px; .handoff-layout { .viewer-section { flex-wrap: nowrap; + margin-top: 0; &.fullscreen { .settings-bar, .settings-bar { diff --git a/frontend/resources/styles/main/layouts/viewer.scss b/frontend/resources/styles/main/layouts/viewer.scss index 28a817ad7..840c2b559 100644 --- a/frontend/resources/styles/main/layouts/viewer.scss +++ b/frontend/resources/styles/main/layouts/viewer.scss @@ -1,4 +1,5 @@ .viewer-layout { + height: 100vh; display: grid; grid-template-rows: 48px auto; grid-template-columns: 1fr; @@ -15,14 +16,34 @@ } } +.fullscreen.viewer-layout.force-visible { + grid-template-rows: 1fr; + & .viewer-header { + position: fixed; + top: 0; + transition: top 400ms ease 300ms; + margin-bottom: 0; + z-index: 2; + } + + & .viewer-bottom { + position: fixed; + bottom: 0; + transition: bottom 400ms ease 300ms; + z-index: 2; + } +} + .fullscreen.viewer-layout:not(.force-visible) { + grid-template-rows: 1fr; & .viewer-header { width: 100%; position: fixed; top: -48px; left: 0; transition: top 400ms ease 300ms; - z-index: 1; + z-index: 2; + margin-bottom: 48px; &::after { content: " "; position: absolute; @@ -38,6 +59,28 @@ transition: top 200ms; } + & .viewer-bottom { + width: 100%; + position: fixed; + bottom: -48px; + left: 0; + transition: bottom 400ms ease 300ms; + z-index: 2; + &::after { + content: " "; + position: absolute; + width: 100%; + height: 1rem; + left: 0; + bottom: 0px; + } + } + + & .viewer-bottom:hover { + bottom: 0px; + transition: bottom 200ms; + } + & .viewer-content { grid-row: 1 / span 2; } diff --git a/frontend/resources/styles/main/partials/viewer-header.scss b/frontend/resources/styles/main/partials/viewer-header.scss index 11871eee2..b8b3a5ccc 100644 --- a/frontend/resources/styles/main/partials/viewer-header.scss +++ b/frontend/resources/styles/main/partials/viewer-header.scss @@ -6,7 +6,8 @@ grid-template-columns: 45% 10% 45%; height: 48px; padding: 0 $size-4 0 55px; - position: relative; + top: 0; + position: absolute; justify-content: space-between; width: 100vw; diff --git a/frontend/resources/styles/main/partials/viewer.scss b/frontend/resources/styles/main/partials/viewer.scss index 00a0c14bc..30845460a 100644 --- a/frontend/resources/styles/main/partials/viewer.scss +++ b/frontend/resources/styles/main/partials/viewer.scss @@ -1,6 +1,5 @@ .viewer-content { background-color: black; - display: grid; grid-template-rows: 232px auto; grid-template-columns: 1fr; @@ -8,19 +7,19 @@ .viewer-section { height: calc(100vh - 48px); - &.fullscreen { - height: 100vh; - } grid-row: 1 / span 2; grid-column: 1 / span 1; - display: flex; justify-content: center; align-items: center; flex-flow: wrap; - overflow: auto; + &.fullscreen { + height: 100vh; + margin-top: 0px; + } + & .viewer-go-prev, & .viewer-go-next { position: absolute; @@ -28,7 +27,7 @@ display: flex; align-items: center; width: 53px; - + z-index: 2; .arrow { display: none; align-items: center; @@ -87,6 +86,7 @@ width: 100%; display: flex; justify-content: space-between; + align-items: center; &.left-bar { width: calc(100% - 512px); diff --git a/frontend/src/app/main/ui/viewer.cljs b/frontend/src/app/main/ui/viewer.cljs index ced7b3c6a..0ccf2d9bb 100644 --- a/frontend/src/app/main/ui/viewer.cljs +++ b/frontend/src/app/main/ui/viewer.cljs @@ -275,6 +275,19 @@ interactions-mode (:interactions-mode local) + click-on-screen + (mf/use-callback + (fn [event] + (let [origin (dom/get-target event) + over-section? (dom/class? origin "viewer-section") + layout (dom/get-element "viewer-layout") + has-force? (dom/class? layout "force-visible")] + + (when over-section? + (if has-force? + (dom/remove-class! layout "force-visible") + (dom/add-class! layout "force-visible")))))) + on-click (mf/use-fn (mf/deps section) @@ -414,17 +427,15 @@ :handoff-layout (= section :handoff) :fullscreen fullscreen?)} - [:& header/header - {:project project - :index index - :file file - :page page - :frame frame - :permissions permissions - :zoom zoom - :section section}] - [:div.viewer-content + [:& header/header {:project project + :index index + :file file + :page page + :frame frame + :permissions permissions + :zoom zoom + :section section}] [:div.thumbnail-close {:on-click #(st/emit! dv/close-thumbnails-panel) :class (dom/classnames :invisible (not (:show-thumbnails local false)))}] [:& thumbnails-panel {:frames frames @@ -434,7 +445,8 @@ :thumbnail-data (:thumbnails file)}] [:section.viewer-section {:id "viewer-section" :ref viewer-section-ref - :class (if fullscreen? "fullscreen" "")} + :class (if fullscreen? "fullscreen" "") + :on-click click-on-screen} (cond (empty? frames) [:section.empty-state diff --git a/frontend/src/app/main/ui/viewer/handoff.cljs b/frontend/src/app/main/ui/viewer/handoff.cljs index 2eb108de6..bb488fdba 100644 --- a/frontend/src/app/main/ui/viewer/handoff.cljs +++ b/frontend/src/app/main/ui/viewer/handoff.cljs @@ -22,7 +22,17 @@ (fn [event] (dom/prevent-default event) (dom/stop-propagation event) - (st/emit! (dv/select-shape (:id frame))))) + (st/emit! (dv/select-shape (:id frame))) + + (let [origin (dom/get-target event) + over-section? (dom/class? origin "handoff-svg-container") + layout (dom/get-element "viewer-layout") + has-force? (dom/class? layout "force-visible")] + + (when over-section? + (if has-force? + (dom/remove-class! layout "force-visible") + (dom/add-class! layout "force-visible")))))) (mf/defc viewport [{:keys [local file page frame index viewer-pagination size]}] From be1c19e71845a9f50165c373009c7c52fffeca86 Mon Sep 17 00:00:00 2001 From: Andrey Antukh Date: Wed, 24 Aug 2022 10:59:38 +0200 Subject: [PATCH 3/4] :bug: Fix comments positioning on viewer (regression) --- frontend/src/app/main/ui/viewer/comments.cljs | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/frontend/src/app/main/ui/viewer/comments.cljs b/frontend/src/app/main/ui/viewer/comments.cljs index 96c44b262..8b1cf5c16 100644 --- a/frontend/src/app/main/ui/viewer/comments.cljs +++ b/frontend/src/app/main/ui/viewer/comments.cljs @@ -91,7 +91,6 @@ (mf/defc comments-layer [{:keys [zoom file users frame page] :as props}] - (prn "comments-layer") (let [profile (mf/deref refs/profile) local (mf/deref refs/comments-local) @@ -113,12 +112,12 @@ modifier1 (mf/with-memo [frame-corner] (-> (gmt/matrix) (gmt/translate (gpt/negate frame-corner)))) + modifier2 (mf/with-memo [frame-corner] (-> (gpt/point frame-corner) (gmt/translate-matrix))) - - threads (mf/with-memo [threads-map positions] + threads (mf/with-memo [threads-map positions frame local profile] (->> (vals threads-map) (map (partial update-thread-position positions)) (filter #(= (:frame-id %) (:id frame))) @@ -126,7 +125,6 @@ (filter (fn [{:keys [position]}] (gsh/has-point? frame position))))) - on-bubble-click (mf/use-fn (mf/deps open-thread-id) @@ -160,9 +158,7 @@ (mf/use-fn (mf/deps frame-id modifier2) (fn [draft] - (let [params (-> draft - (update :position gpt/transform modifier2) - (assoc :frame-id frame-id))] + (let [params (assoc draft :frame-id frame-id)] (st/emit! (dcm/create-thread-on-viewer params) (dcm/close-thread)))))] From 8ce8b3fdefbce19a96754beb1013b75948e3d0d2 Mon Sep 17 00:00:00 2001 From: Andrey Antukh Date: Wed, 24 Aug 2022 10:59:56 +0200 Subject: [PATCH 4/4] :paperclip: Update docker images related files --- docker/devenv/Dockerfile | 2 +- docker/images/Dockerfile.exporter | 2 +- docker/images/files/config.js | 11 ----------- 3 files changed, 2 insertions(+), 13 deletions(-) diff --git a/docker/devenv/Dockerfile b/docker/devenv/Dockerfile index d3af5c86a..3a7138921 100644 --- a/docker/devenv/Dockerfile +++ b/docker/devenv/Dockerfile @@ -3,7 +3,7 @@ LABEL maintainer="Andrey Antukh " ARG DEBIAN_FRONTEND=noninteractive -ENV NODE_VERSION=v16.16.0 \ +ENV NODE_VERSION=v16.17.0 \ CLOJURE_VERSION=1.11.1.1149 \ CLJKONDO_VERSION=2022.06.22 \ BABASHKA_VERSION=0.8.156 \ diff --git a/docker/images/Dockerfile.exporter b/docker/images/Dockerfile.exporter index 5b1e90458..144b5a9c1 100644 --- a/docker/images/Dockerfile.exporter +++ b/docker/images/Dockerfile.exporter @@ -5,7 +5,7 @@ ARG DEBIAN_FRONTEND=noninteractive ENV LANG=en_US.UTF-8 \ LC_ALL=en_US.UTF-8 \ - NODE_VERSION=v16.15.1 + NODE_VERSION=v16.17.0 RUN set -ex; \ mkdir -p /etc/resolvconf/resolv.conf.d; \ diff --git a/docker/images/files/config.js b/docker/images/files/config.js index ef86caa0e..7bc9ce940 100644 --- a/docker/images/files/config.js +++ b/docker/images/files/config.js @@ -1,13 +1,2 @@ // Frontend configuration - -//var penpotPublicURI = "https://penpot.example.com"; -//var penpotDemoWarning = ; -//var penpotAllowDemoUsers = ; -//var penpotGoogleClientID = ""; -//var penpotGitlabClientID = ""; -//var penpotGithubClientID = ""; -//var penpotOIDCClientID = ""; -//var penpotLoginWithLDAP = ; -//var penpotRegistrationEnabled = ; -//var penpotAnalyticsEnabled = ; //var penpotFlags = "";