From cbb3f6672f5a0874adaa1592ff7bc6c09e3b2ea8 Mon Sep 17 00:00:00 2001 From: Eva Marco Date: Fri, 28 Mar 2025 10:38:35 +0100 Subject: [PATCH] :bug: Fix asset name on inspect tab (#6173) Signed-off-by: Eva Marco --- CHANGES.md | 2 + backend/src/app/rpc/commands/viewer.clj | 5 +- frontend/playwright/ui/pages/WorkspacePage.js | 3 ++ .../ui/specs/inspect-layout.spec.js | 52 +++++++++++++++++++ frontend/src/app/main/data/viewer.cljs | 2 + .../main/ui/inspect/attributes/common.cljs | 23 ++++---- 6 files changed, 73 insertions(+), 14 deletions(-) diff --git a/CHANGES.md b/CHANGES.md index 7b2016eeca..27f46b4b41 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -40,6 +40,8 @@ - Fix problem with constraints when creating group [Taiga #10455](https://tree.taiga.io/project/penpot/issue/10455) - Fix opening pen with shortcut multiple times breaks toolbar [Taiga #10566](https://tree.taiga.io/project/penpot/issue/10566) - Fix actions when workspace is visited first time [Taiga #10548](https://tree.taiga.io/project/penpot/issue/10548) +- Chat icon overlaps "Show" button in carrousel section [Taiga #10542](https://tree.taiga.io/project/penpot/issue/10542) +- Fix assets name on inspect tab [Taiga #10630](https://tree.taiga.io/project/penpot/issue/10630) - Fix chat icon overlaps "Show" button in carrousel section [Taiga #10542](https://tree.taiga.io/project/penpot/issue/10542) - Fix incorrect handling of background task result (now task rows are properly marked as completed) diff --git a/backend/src/app/rpc/commands/viewer.clj b/backend/src/app/rpc/commands/viewer.clj index 7e471e4fc2..e86f130330 100644 --- a/backend/src/app/rpc/commands/viewer.clj +++ b/backend/src/app/rpc/commands/viewer.clj @@ -78,7 +78,10 @@ :always (update :data select-keys [:id :options :pages :pages-index :components])) - libs (files/get-file-libraries conn file-id) + libs (->> (files/get-file-libraries conn file-id) + (mapv (fn [{:keys [id] :as lib}] + (merge lib (files/get-file cfg id))))) + links (->> (db/query conn :share-link {:file-id file-id}) (mapv (fn [row] (-> row diff --git a/frontend/playwright/ui/pages/WorkspacePage.js b/frontend/playwright/ui/pages/WorkspacePage.js index 96646a1578..3fc9b42db0 100644 --- a/frontend/playwright/ui/pages/WorkspacePage.js +++ b/frontend/playwright/ui/pages/WorkspacePage.js @@ -245,6 +245,9 @@ export class WorkspacePage extends BaseWebSocketPage { async clickAssets(clickOptions = {}) { await this.sidebar.getByText("Assets").click(clickOptions); } + async clickLayers(clickOptions = {}) { + await this.sidebar.getByText("Layers").click(clickOptions); + } async openLibrariesModal(clickOptions = {}) { await this.sidebar.getByTestId("libraries").click(clickOptions); diff --git a/frontend/playwright/ui/specs/inspect-layout.spec.js b/frontend/playwright/ui/specs/inspect-layout.spec.js index c5678ae010..176992ca30 100644 --- a/frontend/playwright/ui/specs/inspect-layout.spec.js +++ b/frontend/playwright/ui/specs/inspect-layout.spec.js @@ -70,3 +70,55 @@ test("[Taiga #9116] Copy CSS background color in the selected format in the INSP ); expect(rgbaColorText).toContain("background: rgba("); }); + +test("[Taiga #10630] [INSPECT] Style assets not being displayed on info tab", async ({ + page, + context, +}) => { + const workspacePage = new WorkspacePage(page); + await workspacePage.setupEmptyFile(page); + await workspacePage.goToWorkspace(); + await workspacePage.mockRPC( + "link-file-to-library", + "workspace/link-file-to-library.json", + ); + + await workspacePage.mockRPC( + "unlink-file-from-library", + "workspace/unlink-file-from-library.json", + ); + + await workspacePage.mockRPC( + "get-team-shared-files?team-id=*", + "workspace/get-team-shared-libraries-non-empty.json", + ); + + await workspacePage.clickColorPalette(); + await workspacePage.clickAssets(); + await workspacePage.mockRPC(/get\-file\?/, "workspace/get-file-library.json"); + await workspacePage.openLibrariesModal(); + await workspacePage.clickLibrary("Testing library 1"); + await workspacePage.closeLibrariesModal(); + + await expect( + workspacePage.palette.getByRole("button", { name: "test-color-187cd5" }), + ).toBeVisible(); + + await workspacePage.clickLayers(); + + await workspacePage.rectShapeButton.click(); + await workspacePage.clickWithDragViewportAt(128, 128, 200, 100); + await workspacePage.clickLeafLayer("Rectangle"); + await workspacePage.palette + .getByRole("button", { name: "test-color-187cd5" }) + .click(); + + const inspectButton = workspacePage.page.getByRole("tab", { + name: "Inspect", + }); + await inspectButton.click(); + + const colorLibraryName = workspacePage.page.getByTestId("color-library-name"); + + await expect(colorLibraryName).toHaveText("test-color-187cd5"); +}); diff --git a/frontend/src/app/main/data/viewer.cljs b/frontend/src/app/main/data/viewer.cljs index 770c24bf1e..d3baca1317 100644 --- a/frontend/src/app/main/data/viewer.cljs +++ b/frontend/src/app/main/data/viewer.cljs @@ -189,6 +189,8 @@ (assoc :share-links share-links) (assoc :current-team-id team-id) (assoc :teams {team-id team}) + (assoc :files (-> (d/index-by :id libraries) + (assoc (:id file) file))) (assoc :viewer {:libraries (d/index-by :id libraries) :users (d/index-by :id users) :permissions permissions diff --git a/frontend/src/app/main/ui/inspect/attributes/common.cljs b/frontend/src/app/main/ui/inspect/attributes/common.cljs index b9ab29bd7b..1a0f16d2cf 100644 --- a/frontend/src/app/main/ui/inspect/attributes/common.cljs +++ b/frontend/src/app/main/ui/inspect/attributes/common.cljs @@ -32,16 +32,11 @@ (get-in state [libraries-place file-id :data :colors]))] (l/derived get-library st/state))) -(defn- get-colors-library [color] - (let [colors-library-v (-> (mf/use-memo - (mf/deps (:file-id color)) - #(make-colors-library-ref :viewer-libraries (:file-id color))) - mf/deref) - colors-library-ws (-> (mf/use-memo - (mf/deps (:file-id color)) - #(make-colors-library-ref :libraries (:file-id color))) - mf/deref)] - (or colors-library-v colors-library-ws))) +(defn- use-colors-library [color] + (-> (mf/use-memo + (mf/deps (:file-id color)) + #(make-colors-library-ref :files (:file-id color))) + mf/deref)) (defn- get-file-colors [] (or (mf/deref file-colors-ref) (mf/deref refs/workspace-file-colors))) @@ -54,7 +49,7 @@ (str/capital $))) (mf/defc color-row [{:keys [color format copy-data on-change-format]}] - (let [colors-library (get-colors-library color) + (let [colors-library (use-colors-library color) file-colors (get-file-colors) color-library-name (get-in (or colors-library file-colors) [(:id color) :name]) color (assoc color :color-library-name color-library-name) @@ -85,7 +80,8 @@ (when color-library-name [:div {:class (stl/css :second-row)} - [:div {:class (stl/css :color-name-library)} + [:div {:class (stl/css :color-name-library) + :data-testid "color-library-name"} color-library-name]])]] [:div {:class (stl/css :image-download)} @@ -146,6 +142,7 @@ (when color-library-name [:div {:class (stl/css :second-row)} - [:div {:class (stl/css :color-name-library)} + [:div {:class (stl/css :color-name-library) + :data-testid "color-library-name"} color-library-name]])]])))