From 1d8f2fc7172b744f286e9448abcd59b6ebf7530e Mon Sep 17 00:00:00 2001 From: Eva Marco Date: Thu, 5 Nov 2026 11:31:50 +0100 Subject: [PATCH] :recycle: Give the viewer logo a real link and the DS logo asset (#12702) The Penpot logo in the viewer header was an without href. For team members it now links to the dashboard Recent page of the file's team: a plain click still runs the in-app navigation (prevent default), and Ctrl/Cmd-click opens the link in a new tab. Without team permission it stays as before: no href and no click. The logo uses the DS raw-svg* asset instead of the legacy icon (same drawing, same 28px class). This was the last legacy icon in viewer/header.cljs. The "Viewer header" visual test gives 0 px of difference. AI-assisted-by: claude-opus-5-5 --- frontend/src/app/main/ui/viewer/header.cljs | 34 +++++++++++++-------- 1 file changed, 22 insertions(+), 12 deletions(-) diff --git a/frontend/src/app/main/ui/viewer/header.cljs b/frontend/src/app/main/ui/viewer/header.cljs index e0907d26aa..a433cc5c7f 100644 --- a/frontend/src/app/main/ui/viewer/header.cljs +++ b/frontend/src/app/main/ui/viewer/header.cljs @@ -12,18 +12,21 @@ [app.main.data.shortcuts :as scd] [app.main.data.viewer :as dv] [app.main.data.viewer.shortcuts :as sc] + [app.main.refs :as refs] + [app.main.router :as rt] [app.main.store :as st] [app.main.ui.components.dropdown :refer [dropdown]] [app.main.ui.ds.buttons.button :refer [button*]] [app.main.ui.ds.buttons.icon-button :refer [icon-button*]] [app.main.ui.ds.foundations.assets.icon :as i :refer [icon*]] + [app.main.ui.ds.foundations.assets.raw-svg :as raw-svg :refer [raw-svg*]] [app.main.ui.exports.assets :refer [progress-widget]] [app.main.ui.formats :as fmt] - [app.main.ui.icons :as deprecated-icon] [app.main.ui.viewer.comments :refer [comments-menu]] [app.main.ui.viewer.interactions :refer [flows-menu* interactions-menu*]] [app.util.dom :as dom] [app.util.i18n :refer [tr]] + [app.util.keyboard :as kbd] [okulary.core :as l] [rumext.v2 :as mf])) @@ -276,15 +279,20 @@ [:span {:class (stl/css :frame-name)} frame-name] [:> icon* {:icon-id i/arrow-down :size "s" :class (stl/css :icon)}]]]])) -(def ^:private penpot-logo-icon - (deprecated-icon/icon-xref :penpot-logo-icon (stl/css :logo-icon))) - - (mf/defc header [{:keys [project file page frame zoom section permissions index interactions-mode shown-thumbnails share]}] - (let [go-to-dashboard + (let [in-team? (:in-team permissions) + router (mf/deref refs/router) + dashboard-href (when in-team? + (rt/resolve-uri router :dashboard-recent {:team-id (:team-id project)})) + + go-to-dashboard (mf/use-fn - #(st/emit! (dv/go-to-dashboard))) + (fn [event] + ;; Ctrl/Cmd-click opens the href in a new tab, as any link. + (when-not (kbd/mod? event) + (dom/prevent-default event) + (st/emit! (dv/go-to-dashboard))))) go-to-inspect (mf/use-fn @@ -324,13 +332,15 @@ :fullscreen (mf/deref fullscreen-ref)) :on-click close-thumbnails} [:div {:class (stl/css :nav-zone)} - ;; If the user doesn't have permission we disable the link + ;; Without team permission the logo is not a link: no href, no click. [:a {:class (stl/css :home-link) - :on-click go-to-dashboard + :href dashboard-href + :on-click (when in-team? go-to-dashboard) :data-testid "penpot-logo-link" - :style {:cursor (when-not (:in-team permissions) "auto") - :pointer-events (when-not (:in-team permissions) "none")}} - penpot-logo-icon] + :style {:cursor (when-not in-team? "auto") + :pointer-events (when-not in-team? "none")}} + [:> raw-svg* {:id raw-svg/penpot-logo-icon + :class (stl/css :logo-icon)}]] [:& header-sitemap {:project project :file file